一起来学习《响应式Web设计-HTML5和CSS3实战》吧
《响应式Web设计-HTML5和CSS3实战》是一本不错的前台设计书。书里主要以一个页面入手，涵盖了HTML5和CSS3的所有知识。
下午我根据http://www.andthewinnerisnt.com 这个网页上的资源下载下来了所需的一些图片，然后构建了主页index.html。这里放上代码，这是本人写的HTML4+CSS2.1的东西。这里分享给大家。大家可以根据上面给的网站自己去下载图片资源，然后使用我写的这个。这样就可以很快进入第三章的学习了。先不说代码，先上图！
首先是页面index.html
#wrapper{margin-right:auto;margin-left:auto;width:960px;}#header{margin-right:10px;margin-left:10px;width:940px;height:200px;background-color:white;background-image:url(image/buntingFW.png);background-repeat:repeat-x;}#headline{height:140px;font-size:48px;font-family:Arial;}#headline span{position:relative;top:70px;left:10px;}#special_hint{color:#aeaeae;}#navigation{background-color:white;background-image:url(image/atwiNavBg.png);background-repeat:repeat-x;height:30px;}#navigation ul{margin:0px;padding:0px;}#navigation ul li{display:inline-block;}#navigation ul li a{text-decoration:none;font-size:25px;font-family:Arial;font-weight:bold;color:black;margin-left:10px;margin-right:10px;}#main{border-top: dashed 1px #B67F7F;border-bottom: dashed 1px #B67F7F;background-color:white;background-image:url(image/sidebarBg.png);background-repeat:repeat-x;padding-top:40px;height:550px;}#siderbar{margin-right:10px;margin-left:10px;padding-left:5px;padding-right:5px;border-right:solid 3px #eaeaea;width:180px;float:left;}#siderbar span{font-size:20px;font-family:Arial;font-weight:bold;color:black;clear:both;}#siderbar img{width:43%;float:left;padding:10px 5px 10px 5px;}#content{margin-right:10px;float:right;margin-left:10px;width:700px;font-family:Arial;}#content img{float:left;width:200px;}#text{float:right;width:480px;}#text h1{font-size:70px;margin:0px;padding:0px;}#text h2{margin:0px;padding:0px;font-size:40px;color:#7F7F7F;}#text span{color:#7F7F7F;font-size:18px;line-height:30px;height:30px;}#footer{display:block;margin-right:10px;margin-left:10px;clear:both;width:940px;height:150px;}#notation{height:80px;text-align:center;padding-top:20px;font-size:15px;color:brown;}#footimg{background-image:url(image/buntingFWinvert.png);background-repeat:repeat-x;height:40px;}