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

很多css爱好者都已经对css和html相关的知识都已经非常熟悉了，但是还没有什么实际的布局经验。从这节课开始我们来手把手交大家来布局一个网站的首页。
网站首页就拿本站的那写吧。大家也很熟悉。
这个教程可能会分几部分来讲解，我会把代码都放上来，大家复制到本地测试和修改。
在正式写代码之前我们先来分析一下首页(http://www.xinge360.com)的结构：
1、首页全部内容放在一个容器里面，容器居中。
2、首页分为顶部、LOGO部分、导航栏部分、搜索部分、主体部分、友情链接部分和网页底部。
3、首页主体部分又分为了左侧教程栏目块和右侧热点、推荐和更新模块。

二话不说了，先把HTML大体的代码写出来：



信鸽网_编程爱好者天地




top
header
navigation
search
main
flink
footer



上面是首页大致的HTML代码，更加详细的CSS样式和HTML代码我们将在下一节继续。。。 有用  |  无用 取消

猜你喜欢