【免费】干净简洁的设计师作品展示CSS3模板_干净简洁宽屏设计作品图片展示个人单页html.rar资源-CSDN文库

共41个文件

css：17个

jpg：7个

svg：6个

html

毕业设计

需积分: 0 25 浏览量 2023-09-11 08:38:42 上传评论收藏 298KB RAR 举报

资源推荐

资源详情

资源评论

收起资源包目录

干净简洁的设计师作品展示CSS3模板_干净简洁宽屏设计作品图片展示个人单页html.rar （41个子文件）

style.css 12KB

button.svg 447B

mobileUI-flat.css 2KB

button-alt.svg 443B

jquery-1.8.3.min.js 91KB

jquery.formerize-1.0.js 14KB

ie8.css 633B

portfolio06.jpg 23KB

core.css 6KB

style-1000px.css 1KB

core-noscript.css 3KB

ie7.css 835B

core-1000px.css 415B

portfolio04.jpg 36KB

social.png 4KB

ie9.css 714B

portfolio03.jpg 34KB

style-desktop.css 3KB

portfolio05.jpg 25KB

work03.png 4KB

mobileUI-modern.css 4KB

style-mobile.css 3KB

work01.png 2KB

bg.png 10KB

html5shiv.js 2KB

work02.png 2KB

social-li.svg 439B

init.js 6KB

me.jpg 38KB

mobileUI-site-nav-opener-bg.svg 352B

index.html 8KB

portfolio02.jpg 19KB

core-1200px.css 415B

button-alt-active.svg 443B

jquery.js 90KB

core-fluid.css 394B

button-active.svg 447B

core-mobile.css 1KB

mobileUI-beveled.css 4KB

portfolio01.jpg 21KB

core-desktop.css 2KB

<!DOCTYPE HTML>  <html> <head> <title>Miniport </title> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <meta name="description" content="" /> <meta name="keywords" content="" /> <link href="http://fonts.googleapis.com/css?family=Open+Sans:300,600,700" rel="stylesheet" /> <script src="js/jquery-1.8.3.min.js"></script> <script src="css/5grid/init.js?use=mobile,desktop,1000px"></script> <script src="js/init.js"></script> <noscript> <link rel="stylesheet" href="css/5grid/core.css" /> <link rel="stylesheet" href="css/5grid/core-desktop.css" /> <link rel="stylesheet" href="css/5grid/core-1200px.css" /> <link rel="stylesheet" href="css/5grid/core-noscript.css" /> <link rel="stylesheet" href="css/style.css" /> <link rel="stylesheet" href="css/style-desktop.css" /> </noscript>    </head> <body>  <nav id="nav"> <ul> <li><a href="#top">Top</a></li> <li><a href="#work">Work</a></li> <li><a href="#portfolio">Portfolio</a></li> <li><a href="#contact">Contact</a></li> </ul> </nav>  <div class="wrapper wrapper-style1 wrapper-first"> <article class="5grid-layout" id="top"> <div class="row"> <div class="4u"> <span class="me image image-full"><img src="images/me.jpg" alt="" /></span> </div> <div class="8u"> <header> <h1>Hi. I'm <strong>Jane Doe</strong>.</h1> </header> <p>And this is <strong>Miniport</strong>, a free, fully responsive HTML5 site template designed by AJ for <a href="http://www.moobnn.com/" title="模板在线">模板在线</a> <a href="http://guantaow.taobao.com" target="_blank">厚朴网络淘宝店</a> & released under the <a href="#">CCA license</a>.</p> <a href="#work" class="button button-big">Learn about what I do</a> </div> </div> </article> </div>  <div class="wrapper wrapper-style2"> <article id="work"> <header> <h2>I design and build amazing things.</h2> <span>Odio turpis amet sed consequat eget posuere consequat.</span> </header> <div class="5grid-layout"> <div class="row"> <div class="4u"> <section class="box box-style1"> <span class="image image-centered"><img src="images/work01.png" alt="" /></span> <h3>Consequat lorem</h3> <p>Ornare nulla proin odio consequat sapien vestibulum ipsum primis sed amet consequat lorem dolore.</p> </section> </div> <div class="4u"> <section class="box box-style1"> <span class="image image-centered"><img src="images/work02.png" alt="" /></span> <h3>Lorem dolor tempus</h3> <p>Ornare nulla proin odio consequat sapien vestibulum ipsum primis sed amet consequat lorem dolore.</p> </section> </div> <div class="4u"> <section class="box box-style1"> <span class="image image-centered"><img src="images/work03.png" alt="" /></span> <h3>Feugiat posuere</h3> <p>Ornare nulla proin odio consequat sapien vestibulum ipsum primis sed amet consequat lorem dolore.</p> </section> </div> </div> </div> <footer> <p>Lorem ipsum dolor sit sapien vestibulum ipsum primis?</p> <a href="#portfolio" class="button button-big">See some of my recent work</a> </footer> </article> </div>  <div class="wrapper wrapper-style3"> <article id="portfolio"> <header> <h2>Awesome work makes happy clients.</h2> <span>Proin odio consequat sapien vestibulum ipsum primis sed amet consequat lorem dolore feugiat lorem ipsum dolore.</span> </header> <div class="5grid-layout"> <div class="row"> <div class="12u"> </div> </div> <div class="row"> <div class="4u"> <article class="box box-style2"> <a href="#" class="image image-full"><img src="images/portfolio01.jpg" alt="" /></a> <h3><a href="#">Magna feugiat</a></h3> <p>Ornare nulla proin odio consequat.</p> </article> </div> <div class="4u"> <article class="box box-style2"> <a href="#" class="image image-full"><img src="images/portfolio02.jpg" alt="" /></a> <h3><a href="#">Veroeros primis</a></h3> <p>Ornare nulla proin odio consequat.</p> </article> </div> <div class="4u"> <article class="box box-style2"> <a href="#" class="image image-full"><img src="images/portfolio03.jpg" alt="" /></a> <h3><a href="#">Lorem ipsum</a></h3> <p>Ornare nulla proin odio consequat.</p> </article> </div> </div> <div class="row"> <div class="4u"> <article class="box box-style2"> <a href="#" class="image image-full"><img src="images/portfolio04.jpg" alt="" /></a> <h3><a href="#">Tempus dolore</a></h3> <p>Ornare nulla proin odio consequat.</p> </article> </div> <div class="4u"> <article class="box box-style2"> <a href="#" class="image image-full"><img src="images/portfolio05.jpg" alt="" /></a> <h3><a href="#">Feugiat aliquam</a></h3> <p>Ornare nulla proin odio consequat.</p> </article> </div> <div class="4u"> <article class="box box-style2"> <a href="#" class="image image-full"><img src="images/portfolio06.jpg" alt="" /></a> <h3><a href="#">Sed amet ornare</a></h3> <p>Ornare nulla proin odio consequat.</p> </article> </div> </div> </div> <footer> <p>Lorem ipsum dolor sit sapien vestibulum ipsum primis?</p> <a href="#contact" class="button button-big">Get in touch with me</a> </footer> </article> </div>  <div class="wrapper wrapper-style4"> <article id="contact"> <header> <h2>Want to hire me? Get in touch!</h2> <span>Ornare nulla proin odio consequat sapien vestibulum ipsum sed lorem.</span> </header> <div class="5grid"> <div class="row"> <div class="12u"> <form method="post" action="#"> <div class="5grid"> <div class="row"> <div class="6u"> <input type="text" name="name" id="name" placeholder="Name" /> </div> <div class="6u"> <input type="text" name="email" id="email" placeholder="Email" /> </div> </div> <div class="row"> <div class="12u"> <input type="text" name="subject" id="subject" placeholder="Subject" /> </div> </div> <div class="row"> <div class="12u"> <textarea name="message" id="message" placeholder="Message"></textarea> </div> </div> <div class="row"> <div class="12u"> <input type="submit" class="button" value="Send Message" /> <input type="reset" class="button button-alt" value="Clear Form" /> </div> </div> </div> </form> </div> </div> <div class="row row-special"> <div class="12u"> <h3>Find me on ...</h3> <ul class="social"> <li class="facebook"><a href="#">Facebook</a></li> <li class="twitter"><a href="#">Twitter</a></li> <li class="dribbble"><a href="http://dribbble.com/n33">Dribbble</a></li>

评论收藏

内容反馈