#nav{
height:25px;
width:760px;
font-size:14px;
list-style-type:none;
}
#navli{
float:left;
}
#navlia{
color:#000000;
text-decoration:none;
padding-top:4px;
display:block;
width:97px;
height:22px;
text-align:center;
background-color:#009966;
margin-left:2px;
}
#navlia:hover{
background-color:#006633;
color:#FFFFFF;
}
内容部分主要放入文章内容，有标题和段落，标题加粗，为了规范化，我用H标签，段落要自动实现首行缩进2个字,同时所有内容看起来要和外层大盒子边框有一定距离，这里用填充。内容区块样式代码为：
#content{
height:auto;
width:740px;
line-height:1.5em;
padding:10px;
}
#contentp{
text-indent:2em;
}
#contenth5{
font-size:16px;
margin:10px;
版权栏，给它加个背景，与页头相映，里面文字要自动居中对齐，有多行内容时，行间距合适，这里的链接样式也可以单独指定，我这里就不做了。其样式代码如下：
#footer{
height:50px;
width:740px;
line-height:2em;
text-align:center;
background-color:#009966;
padding:10px;
}
最后回到样式开头大家会看到这样的样式代码：
*{
margin:0px;
padding:0px;
}
这是用了通配符初始化各标签边界和填充，（因为有部分标签默认会有一定的边界，如Form标签）那么接下来就不用对每个标签再加以这样的控制，这可以在一定程度上简化代码。最终完成全部样式代码是这样的：
<styletype="text/css">
<!--
*{
margin:0px;
padding:0px;
评论加载中…
 |