以前用CSS+DIV做过两个小项目，感觉并不是很通畅，觉得有必要在这方面补补课，最近又用CSS+DIV山寨了几个界面，算是练手吧，现在思路清晰多了，和大家分享。

一、为什么采用CSS+DIV布局？简单谈几点？

首先，CSS+DIV布局对搜索引擎友好，为什么友好？是因为CSS+Div布局的代码简单，提高spider爬行效率，能在较短的时间内爬完整个页面，这样对收录质量有好处。真正的网站优化不只是为了追求收录，还需要良好的用户体验，代码简单自然会有良好的响应速度，对提高用户体验很有帮助。

例如：结合CSS和XHTML来制作导航菜单会比使用Javascript或图片来实现同样效果更加节省代码(CSS可以结合一些图片来制作导航而且代码量很小，而完全使用图片的导航代码量也要多很多)，

另外如果尽可能完善到能通过W3C验证，与普通表格组成页面的网站相比，使用XTML架构的网站排名状况要好。

其次，内容与样式分离，修改设计效率高。到CSS里找到相应的ID或class或标记修改属性值即可，使得修改页面的时候更加方便，也不会破坏页面其他部分的布局样式。而且可以实现一键切换整个页面风格。

还有视觉方面，以往表格嵌套的制作方法，使得页面与页面或者区域与区域之间的显示效果会有所偏差；而使用DIV+CSS的制件方法，将所有的页面或所有区域统一用CSS文件控制，就避免了不同区域或不同页面体现出的效果偏差。使用CSS来设计导航菜单并不会限制你的设计。事实上，CSS会提供更加灵活的导航设计方案，当