简洁风个人自适应网页模板下载

 

代码部署教程

1. 引入CSS

<link href=”css/style.css” rel=”stylesheet” type=”text/css” media=”all” />

<link href=’//fonts.googleapis.com/css?family=Oswald:400,300,700′ rel=’stylesheet’ type=’text/css’>

2. HTML代码

<!– main –>

<div class=”main”>

<h1>

UX Navy Profile Widget</h1>

<div class=”main-grid1″>

<div class=”main-grid1-left”>

<img src=”images/1.png” alt=” ” class=”img-responsive” />

</div>

<div class=”main-grid1-right”>

<h2>

Ninel <span>

Potanina</span>

</h2>

<p>

UIX Designer</p>

<ul>

<li>

<a href=”#” class=”facebook”>

</a>

</li>

<li>

<a href=”#” class=”twitter”>

</a>

</li>

<li>

<a href=”#” class=”be”>

</a>

</li>

</ul>

</div>

<div class=”clear”>

</div>

</div>

<div class=”main-grid2″>

<div class=”main-grid2-left”>

<p>

Tweets<span>

29,896</span>

</p>

</div>

<div class=”main-grid2-left”>

<p>

Following<span>

48,678</span>

</p>

</div>

<div class=”main-grid2-left”>

<p>

Followers<span>

12,000</span>

</p>

</div>

<div class=”clear”>

</div>

</div>

<div class=”main-grid3″>

<p>

I am a graphic designer.</p>

<div class=”bar”>

<p>

UX/UX</p>

</div>

<div class=”skills”>

<div class=”skill1″ style=”width:100%”>

</div>

</div>

<div class=”bar”>

<p>

HTML / CSS3 / SASS</p>

</div>

<div class=”skills”>

<div class=”skill2″ style=”width:90%”>

</div>

</div>

<div class=”bar”>

<p>

Javascript</p>

</div>

<div class=”skills”>

<div class=”skill3″ style=”width:75%”>

</div>

</div>

</div>

<div class=”footer”>

<p>

Copyright © 2015 UX Navy Profile Widget. All rights reserved | Design by <a href=”http://cxvn.com”>

cxvn</a>

</p>

</div>

</div>

下载地址

立即下载