《2022年Div常见错误 .pdf》由会员分享，可在线阅读，更多相关《2022年Div常见错误 .pdf（6页珍藏版）》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、Div 常见错误总结一 .吕清泉1. 产品名称 没有给样式b背景定义高度，所以火狐里面显示不出来。.xxx margin-right: 4px; margin-left: 4px; margin-bottom: 8px; padding-top: 3px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; 缩写形式.xxx Margin: 0px 4px 8px 4px; Padding: 3px 0px 0px 0px; 产品大类名称 产品小类名称 产品小类名称 产品小类名称 产品大类名称 产品小类名称 产品大类名称 产品
2、大类名称 产品小类名称 产品小类名称 产品小类名称 产品大类名称 产品小类名称 产品大类名称 名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 1 页，共 6 页 - - - - - - - - - Clear: both ；用法有问题。虽然浏览器上显示排放是正确的，但是DW 里面显示错位。Padding: 0; margin: 0; 出现在绝大多数div 里面。没有实际意义。二 胡兵 电子产品系列 电子产品系列 电子产品系列 电子产品系列 电子产品系列 电子产品系列 电子产品系列 电
3、子产品系列 电子产品系列 电子产品系列 电子产品系列 电子产品系列 电子产品系列 电子产品系列 三个浏览器显示正常三 .胡景焕1. 首页 公司简介 公司简介 公司简介 公司简介 公司简介 公司简介 #top_c height:25px; margin-bottom:10px; padding-top:15px; background-image:url(./images/index3_06.jpg); 名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 2 页，共 6 页 - - - -
4、 - - - - - .top_c Width: 1003px; Height: 20px; Padding: 10px 0px 0px 10px; background-image:url(./images/index3_06.jpg); background-repeat: no-repeat; 2. 产品分类一 产品分类二 产品分类三 产品分类四 产品分类五 火狐显示错位大部分DIV 都定义了高度，但没有定义宽度。设置了左右的边框但没有定义宽度。Clear: both; 标签使用有问题。Id 和 class的意义没有弄清楚。四 .程乐都是图片，显示正常。五，杨双 设为首页 加入收藏 不规
5、范的。 电子产品系列 智能蓄电池放电仪 智能蓄电池放电仪 智能蓄电池放电仪 智能蓄电池放电仪 图片做为文字的背景。大部分DIV 都定义了高度，但是没有考虑实际高度。DIV 跟 table 不同。定义高度后，要是内容超过高度，DIV 不会自动向下延伸，会溢出! Id 和 class的意义没有弄清楚。名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 3 页，共 6 页 - - - - - - - - - 火狐显示错位。六，程娜三个页面显示正常比较规范。七，刘娟Clear : both; 智
6、能蓄电池放电仪 智能蓄电池放电仪 IE6.0 IE7.0 显示正常火狐错位不规范，图片做为文字的背景文本区域设置了宽度和高度，但是没有设置溢出隐藏。overflow: hidden; 八，张家龙IE6 IE7 火狐显示正常，ID 和 class没有区分清楚九，吴丽媛火狐显示有问题。图片居中 #banner_01 margin-top:8px; width:902px; vertical-align:middle; 垂直对齐，居中； 公告：吴丽媛 图片做为文字的背景。DIV vertical-align:middle; 表示垂直对齐，居中；十，秦鹏IE6.0 IE7.0 显示正常火狐显示有小问题
7、 名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 4 页，共 6 页 - - - - - - - - - 文本区域设置了宽度和高度，但是没有设置溢出隐藏。overflow: hidden; 十一，彭钰佳IE6.0 IE7.0 显示正常火狐有点小问题。 ZS-740 微机继电保护测试仪 写法不规范，改成 ZS-740 微机继电保护测试仪 十二 .蔡方琴 !-公司业绩 MORE- 公司业绩 more 写法不规范1.id 和 class 的区别id 是元素的名称，class表示该元素的cs
8、s 类名。名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 5 页，共 6 页 - - - - - - - - - id 的值在整个当前网页中是唯一的。某一个元素定义了id=aaa ，那么这个网页中其它的元素的id 就不能定义成aaa，不容许重复2 次。而class 定义的是类 ,理论上可以无限重复。class =bbb,可以在当前网页中重复出现多次。属性的优先级问题ID 的优先级要高于class 。 这样的话以box 的样式为准。 那么以后面的left 的样式为准。另外，形如id=a
9、aa 定义的 ,在 css 中是这样设置其样式的：#aaa 样式列表 而以 class=bbb形式定义的，在css 中应该这样设置其样式：.bbb 样式列表 2.div 的居中margin: 0 auto; 是指 DIV 上下为0，左右自动，也就是水平居中。text-algin: center; 文本内容水平居中；3.float 所以不管float 元素的内容如何，一定要为其指定width 属性。4.margin 和 padding 的区别margin是隔开元素与外边，它的值指从自身边框到另一个容器边框之间的距离，就是容器外距离padding是隔开元素里边。它的值指从自身内部到另一个容器边框之
10、间的距离，就是容器内距离5.区别 div 和 spandiv 是一个块级元素，可以包含段落，表格等内容，用于放置不同的内容。一般我们在网页通过 div 来布局定位网页中的每个区块。span 是一个内联元素，没有实际意义，它的存在纯粹是为了应用样式，给一段内容加上标记可以通过在span上定义样式来设定其内容的样式。6.DIV 与 TABLE 的区别1. div+css布局比table 布局节省页面代码，代码结构也更清晰明了. 2. div+css的页面对搜索引擎支持好，而且速度更快了,能够比 table 更加快速的显示网站内容 . 3. div+css布局使网站版面布局修改变的更简单。4. 表现和内容相分离。W3C 提倡结构、表现、行为三者分离。结构就是这些内容的方式，表现就是CSS，行为就是 DOM,JavaScript 等。名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 6 页，共 6 页 - - - - - - - - -