几种检查调试CSS布局的有效方法

1. 检查HTML元素是否有拼写错误、是否忘记结束标记　　即使是老手也经常会弄错div的嵌套关系。可以用dreamweaver的验证功能检查一下有无错误。　　2. 检查CSS是否书写正确　　检查一下有无拼写错误、是否忘记结尾的 } 等。可以利用CleanCSS来检查 CSS的拼写错误。CleanCSS本是为CSS减肥的工具，但也能检查出拼写错误。　　3. 用删除法确定错误发生的位置　　如果错误影响了整体布局，则可以逐个删除div块，直到删除某个div块后显示恢复正常，即可确定错误发生的位置。　　4. 利用border属性确定出错元素的布局特性　　使用float属性布局一不小心就会出错。这时为元素添加border属性确定元素边界，错误原因即水落石出。　　5. float元素的父元素不能指定clear属性　　MacIE下如果对float的元素的父元素使用clear属性，周围的float元素布局就会混乱。这是MacIE的著名的bug，倘若不知道就会走弯路。　　6. float元素务必指定width属性　　很多浏览器在显示未指定width的float元素时会有bug。所以不管float元素的内容如何，一定要为其指定width属性。　　另外指定元素时尽量使用em而不是px做单位。　　7. float元素不能指定margin和padding等属性　　IE在显示指定了margin和padding的float元素时有bug。因此不要对float元素指定margin和padding属性(可以在float元素内部嵌套一个div来设置margin和padding)。也可以使用hack方法为IE指定特别的值。　　8. float元素的宽度之和要小于100% 　　如果float元素的宽度之和正好是100%，某些古老的浏览器将不能正常显示。因此请保证宽度之和小于99%。　　9. 是否重设了默认的样式? 　　某些属性如margin、padding等，不同浏览器会有不同的解释。因此最好在开发前首先将全体的margin、padding设置为0、列表样式设置为none等。　　10. 是否忘记了写DTD?

转载于:https://www.cnblogs.com/flyinghigher/archive/2010/09/06/1819633.html

几种检查调试CSS布局的有效方法相关推荐

Photoshop图象切片保存为网页HTML（DIV+CSS布局）的方法
Photoshop图象切片保存为网页HTML(DIV+CSS布局)的方法首先,制作图象切片(以一张图片为例子) 一.选择"切片"工具,在图像上拖动以分割图像(例如:一张图像切割2 ...
5 种常见的 CSS 布局，快看看你会几种？
作者 | 浪里行舟责编 | 胡巍巍本文将介绍如下几种常见的布局: 其中实现三栏布局有多种方式,本文着重介绍圣杯布局和双飞翼布局.另外几种可以猛戳实现三栏布局的几种方法. 单列布局常见的单列布局有 ...
div固定在浏览器顶部_手写几种常见的css布局，1垂直两栏左边固定右边自适应，垂直3栏左右固定中间自适应...
1垂直两栏右边固定左边自适应的四种写法 <!DOCTYPE html> <html lang="en"><head><meta chars ...
几种常见的CSS布局
一.单列布局常见的单列布局有两种: header,content和footer等宽的单列布局 header与footer等宽,content略窄的单列布局 1.如何实现对于第一种,先通过对head ...
几种常见的CSS布局-- 双飞翼布局
双飞翼布局:对圣杯布局(使用相对定位,对以后布局有局限性)的改进,消除相对定位布局原理:主体元素上设置左右边距,预留两翼位置.左右两栏使用浮动和负边距归位,消除相对定位. .container {/ ...
用html布局怎么调试,网页规划 CSS布局调试的有用办法
网页规划中CSS布局是很重要的部分,下面介绍几种查看调试CSS布局的有用办法. 1. 查看HTML元素是否有拼写过错.是否忘掉完毕符号即使是内行也经常会弄错div的嵌套关系.能够用dreamweav ...
6种方法实现css布局水平居中
说到常见css布局,面试时经常也会考考大家,看对css知识掌握的咋样,对css盒模型理解没,比如会问css布局水平居中的方法或者css布局垂直居中的方法等,今天分享常见css布局水平居中的6种方法. ...
理解 CSS 布局和块级格式上下文
本文的目的是介绍一些概念来帮你增强 CSS 码力.如标题所示这篇文章主要是讲块级格式上下文BFCBlock Formatting Context.你可能没听过这个术语但只要你曾经使用过CSS 布局你 ...
一个div 上下两行_web前端工程师如何理解 CSS 布局和块级格式化上下文
CSS是web前端中的重要内容,很多初学者在学习CSS时都会遇到各种各样的问题,今天就给大家分享web前端开发如何理解CSS不惧和块级格式化上下文.也许你从未听说过这个术语,但是如果你曾经用 CSS ...

几种检查调试CSS布局的有效方法

几种检查调试CSS布局的有效方法相关推荐

最新文章

热门文章