"实例十步教你用div css建站，包括页脚设计和副导航条浮动"

=1153&action=edit" title="Edit this entry">编辑</a> <a href="http://css.jorux.com/?p=1153" title="View this entry">浏览</a> <a href="http://css.jorux.com/wp-admin/">登录</a> </div> 这样便能使副导航条右浮,整体呈现在页脚的右侧。 再细调Altnav里的链接格式，整体爬字大小由之前的font-size:80%上调到90%,间距由1px调到0.4em 之前因为文章中已经存在一次对H2的重新定义，所以我们同样需要考虑到H2的层叠关系。先前虽然已经将其重新定义为，由于存在两层理论上重要性相同的H2，我们要再给它们多一些强调。这一点可以通过更换他们的状态来实现，比如hover,link,active: #altnav a:link, #altnav a:visited { color:#9c9c9c; text-decoration:none; border-top:1px solid #cfcfcf; padding:1px 3px; } #altnav a:hover, #altnav a:active { color:#cc0000; text-decoration:underline; border-top:1px solid #cc0000; } 然后用外边距(margin)稍微调整一下位置，让整体上分正好位于底部二分之一的位置。分正好位于底部二分之一的位置 : #footer { width:100%; background-color:#dfdfdf; clear:both; } #altnav { float:right; margin:0.4em 1.4%; height: 1.8em; 线条高柔,浮于底部。 display:inline; } #altnav a:link, #altnav a:visited { color:#9c9c9c; text-decoration:none; border-top:1px solid #cfcfcf; padding:1px 3px; } #altnav a:hover, #altnav a:active { color:#cc0000; text-decoration:underline; border-top:1px solid #cc0000; padding:1px 3px; } 我们最后要在页脚的版权和认证处插入一些小图标，要求垂直居中，并提高点缩小背景位置以完整配合整体美观度。 接下来再对footer里各个小div的层叠关系作些细调 a.删除认证两个字，a链接盒的宽度增加点； b.调整a盒的垂直居中和内边距(margin); c.text缩进两字; 这样就处理好了页脚的样式，将其修饰成符合网站整体风格又不失美观。