1、准备好需要用到的图标。
2、新建html文档。
3、书写hmtl代码。<div class="wr_apper"> <h1>css3书写UI的css3样式</h1> <div class="ds_post_main"> <div class="ds_avatar"> <a><img src="images/zzzzsc.jpg"></a> </div> <div class="ds_comment_b0dy"> <a class="user_name">css3书写UI的css3样式</a> <p>css3书写UI的css3样式</p> </div> </div></div>
4、初始化css代码。<style>body {font-family:Arial;font-size:12px;background:#E5E6D0 url(images/bg.jpg) repeat 0 0;}a {text-decoration:none;}a img {border:0;}a:hover {text-decoration:underline;}.user-name { font-size:14px; font-weight:bold;color:#DE4C1C }.wrapper {width:600px;margin:0 auto;}h1 {font-size:18px;line-height:30px;text-align:center;margin:100px 0;}h1 span {font-size:12px;color:#696A52;}</style>
5、书写css代码。css代码看图片
6、代码整体结构。
7、查看效果。
