Div+css查看源代码讨论查看历史
| Div+css |
|
外文名 ：div+css 本 质：WEB设计标准 特 点： 实现网页页面内容与表现相分离 领 域： 计算机 |
DIV+CSS：是WEB设计标准，它是一种网页的布局方法。与传统中通过表格（table）布局定位的方式不同，它可以实现网页页面内容与表现相分离。提起DIV+CSS组合，还要从XHTML说起。XHTML是一种在HTML（标准通用标记语言的子集）基础上优化和改进的新语言，目的是基于XML应用与强大的数据转换能力，适应未来网络应用更多的需求。
“DIV+CSS”其实是错误的叫法，而标准的叫法应是XHTML+CSS。因为DIV与Table都是XHTML或HTML语言中的一个标记，而CSS只是一种表现形式。也许其提出者本意并没有错，但是跟风者从表现曲解了其意思，认为整个页面就应当是DIV+CSS文件的组合。[1]
作用
1、精简的代码，使用DIV+CSS布局，页面代码精简，这一点相信对XHTML有所了解的都知道。代码精简提高了百度蜘蛛的爬行效率以及高效性，能在最短的时间内爬完整个页面，同时这样对收录质量有一定好处;
2、提高访问速度、增加用户体验性
使得加载速度得到很大的提高，那么用户点击页面的等待时间就越少，用户体验性的增加相应的带来就是网站受到搜索引擎的喜欢，进而提高网站排名。
3、div+css结构清晰，很容易被搜索引擎搜索到，天生就是适合优化seo，降低网页大小，让网页体积变得更小。注意：div+css结构清晰、精简，不意味着可以全部用div+css结构，比如通篇HTML标签全DIV的，貌似除了<head>之上及<body>之上及之外，其它全是
- 结构的，就如同这个页面所有元素全是列表。事实上这两种情况还相当普遍，因为曲解了“DIV+CSS”的真实含义，也许根本就不应该有这个说法，因为一个完整页面几乎不可能仅仅DIV+CSS就能完成。[2]
方法
css是层叠样式表（Cascading Style Sheets）的缩写，用于定义HTML元素的显示形式，是W3C推出的格式化网页内容的标准技术。网页设计者必须掌握的技术之一。[3]
在HTML文档中加入CSS
样式表可分为嵌入式样式表、外部样式表和内联样式表三种，在同一文档内可以同时使用三种方法。
发展
1.样式定义放在一个单独的文件中，例：新建一个后辍为CSS的样式定义。
元素{ 属性color:值red；} 在head段使用<link>标记，
引用语法：<link rel=”stylesheet” type=”text/css” href=”样式表URL” />
2.嵌入式样式表：
<style>元素段必须出现在head段内，有一个开始和结束标记，并且可以有多个<style>段
语法格式： <style type=”text/css”>
使用误区
1、DIV+CSS的合理之处在于可以进行网页的统一设计管理，通过一个样式表，牵一发而动全身，只要修改样式表，就可以统一全站的风格，如果为一个页面单独做一个样式表，或者一个div就做一个样式表，没有全局设计观念，那么这个div+CSS的设计方式就完全没有必要，甚至成了累赘;
2、像Table一样用DIV+CSS，无穷尽的嵌套，其效果与Table设计没有两样，并不会带来搜索引擎的优化效果，反而会增加页面的负担;
3、推崇Div+CSS，却不考虑兼容性，TABLE设计由来已久，得到浏览器的广泛支持，所以显示效果很好，不会出现错位情况，但是DIV+CSS却在 部分浏览器中会发生页面错位的情况，因此在进行设计的时候也要考虑到不同浏览器的情况，进行更改和调试。[4]
视频
DIV+CSS布局的操作方法
DIV+CSS页面布局实例制作
参考资料