display:block; width:97px; height:22px; text-align:center;
background-color: #009966; margin-left:2px; }
#nav li a:hover{ background-color:#006633; color:#FFFFFF; }
内容部分主要放入文章内容,有标题和段落,标题加粗,为了规范化,我用H标签,段落要自动实现首行缩进2个字,同时所有内容看起来要和外层大盒子边框有一定距离,这里用填充。内容区块样式代码为: 以下是引用片段:
#content { height:auto; width: 740px; line-height: 1.5em; padding: 10px; }
#content p { text-indent: 2em; }
#content h5 { 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标签)那么接下来就不用对每个标签再加以这样的控制,这可以在一定程度上简化代码。最终完成全部样式代码是这样的: 以下是引用片段:
结构代码是这样的: 以下是引用片段:
第一段内容
第二段内容
关于华升 | 广告服务 | 华升招聘 | 客服中心 | Q Q留言 | 网站管理 | 会员登录 | 购物车
Copyright ?2006 - 2008 Tang Guohui. All Rights Reserved
相关推荐: