标签：str blog design 重复 img code ado class bsp
第三部分——feature
简要介绍：
这部分比较简单。主要用<p>元素写了两句话。用一张图片设置背景。
页面效果：
HTML代码：
<div >
<section id="feature">
<article>
<p>We work to make web a beautiful place.</p>
<p>We craft beautiful designs and convert them into</p>
<p>fully functional and user-friendy web app.</p>
</article>
</section>
</div>
CSS代码：
#feature {
background: url(img/yellow.png) repeat-x 0 0 ;
/*背景是一张照片，在（0,0）处放置，在X轴重复*/
height: 406px;
z-index: 500; /*Z轴方向上的堆叠顺序，值越大，就显示在上面*/
margin: 0;
padding: 0;
box-shadow: 0 5px 16px rgba(0,0,0,0.3);
}
#feature article{
padding-top:85px;
}
#feature p{
font-family:‘Patua One‘,cursive;
font-size:40px;
text-align:center;
margin-bottom:0;
line-height:0.6em; /*两行文字之间的间距*/
color:#fff;
}
标签：str blog design 重复 img code ado class bsp
原文地址：http://www.cnblogs.com/209yin/p/7588244.html
