div+css实例：布局网站首页(三)

前面二篇文章我们讲完了，首页的基本HTML代码和CSS样式，从这篇开始我们细致的来写首页每个模块的样式。
先看下首页顶部的HTML代码：

      公告栏：编程爱好者技术交流天地：http://www.xinge360.com class="make_home">【设为主页】【收藏本站】

下面是首页顶部top的CSS样式：
#top{
width:960px;
height:28px;
margin:0 auto;
line-height:28px; /*字体行高28px*/
font:12px Arial, Helvetica, sans-serif;
border-bottom:1px solid #ccc;
}
#top .login{
float:left;
margin-top:7px;
}
#top .notice{
padding-left:20px;
background:url("../images/notice.gif") no-repeat left; /*网站公告背景，也就是那个喇叭图片*/
}
#top .make_home{
float:right;
margin-top:7px;
margin-right:10px;
}
网站首页LOGO和BANNER以及广告位我们将在下一篇发布，谢谢阅读。 有用  |  无用 取消

猜你喜欢