代码部署教程
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>
