HTML5 教程学习 - HTML5+CSS3 实战(17) 收场
好了，“HTML5+CSS3实战”系列的最后一篇；本是Smashing Magazine上面的一整篇教程，每天弄来一点最后搞成了17篇连载。HTML5方面的东西慢慢关注下来发现，国外站点上一些公认不错的教程范例，每一篇几乎都有着不同的路子，比如对新标签的理解，使用的策略等等；想来也不奇怪，W3C的HTML5规范本身还处于草案阶段的样子；我个人目前还不打算用它做新东东；CSS3方面倒是在一点点的用着，不过也要看是什么项目了。
不多说了，可以参考“HTML5教程学习 - HTML5+CSS3 实战(9) 页脚”一文来回顾下之前页脚部分的设计样式和HTML。接下来我们来看看样式；将下面的代码添加到main.css中：
/*
About
*****************/
#about {
background: #fff;
font-style: normal;
margin-bottom: 2em;
overflow: hidden;
padding: 20px;
text-align: left;
width: 760px;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}
#about .primary {float: left; width: 165px;}
#about .primary strong {color: #C64350; display: block; font-size: 1.286em;}
#about .photo {float: left; margin: 5px 20px;}
#about .url:link, #about .url:visited {text-decoration: none;}
#about .bio {float: right; width: 500px;}
/*
Footer
*****************/
#contentinfo {padding-bottom: 2em; text-align: right;}
没什么新鲜东东，属于大众码，border-radius在之前也有过介绍了。
作者专门写了几行调整IE6下样式的代码，恕我不拿过来了；IE6的不要。这是一种态度。
我们来看看最终的成品页面吧。突然就结束了，我失落了。默。
译者：Viiiix7210
原文参考：Coding A HTML 5 Layout From Scratch
| < Prev | Next > |
|---|
评论刷新