CSS有哪些常见的错误_CSS常见错误如何详解

　　重构CSS+DIV是网站标准(或称“WEB标准”)中常用的术语之一，通常为了说明与HTML网页设计语言中的表格(table)定位方式的区。下面由学习啦小编为大家整理的CSS常见错误详解，希望大家喜欢!

　　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?

　　如果无论怎样调整不同浏览器显示结果还是不一样，策龙重构那么可以检查一下页面开头是不是忘了写下面这行DTD：

　　css布局对seo的影响

　　1、 代码精简：

　　利用div+css代码比较规范整齐，好处有两点：一、是提高了spider爬行速度，能在较短的时间内完成整个页面，对收录质量比较有好处;二是能高效爬行的页面，就会受到spider的喜欢，这样低收录数量很有效。

　　2、 表格的镶嵌问题：

　　目前来说大部分的网站都用table来布局，遇到多层表格镶嵌时候，会跳过镶嵌的内容或者直接放弃整个页面。

　　网站中过多的相似页面会直接影响到排名和域名信任度。

　　而div+css是通过代码来控制，就不会出现这样的问题，对seo好处多多，要从根本上认识到这个。

　　3、 速度问题：

　　Div+css相对于表格table来说少了很多垃圾代码，加载速度提高对spider爬行是比较有利的，过多的代码会让页面无法访问，影响收录和权重，真正的网站不只是为了追求收录，排名，快速的响应速度也是提高用户体验的基础，如果网站都难以打开，更不要提排名等问题了。

　　4、 修改设计时更有效率

　　Div+css只需要修改响应的定义和id，更方便快捷而且不会破坏页面的布局形式。省时省力。

　　5、 保持视觉的一致性

　　以往的表格布局总是造成在不同的浏览器或者页面造成显示效果有偏差或者错位，而css+div则统一使用css文件控制，就避免了这种情况的出现。

　　6、 对排名的影响

　　Div+css布局，一般在设计完后会尽可能完善到能通过w3c验证，与普通表格布局比，使用xtml架构的网站排名状况一般都是要好很多的。

　　超炫的网页CSS导航有哪些

　　1. Simple Yellow Tabbed

　　这个菜单是从的CSS菜单生成具有更多的免费高品质的菜单。 页面中的演示 。

　　2. Vimeo-Like Top Navigation

　　这种基于CSS的导航菜单是基于Vimeo主菜单。

　　3. Apple Like Colorful CSS Menu

　　为模仿学习沿此菜单教程。 在页面演示后苹果公司的形象过渡的CSS菜单技术。

　　4. CSS Hoverbox

　　由Hoverbox图像廊由Nathan史密斯的CSS Hoverbox开发技术的启发倾斜的background-position的CSS属性，若将周边菜单项顶级鼠标经过图像。 在页面演示 。

　　5. Big CSS Box

　　这是一个实验性的CSS菜单，允许你创建一个缩放菜单调整浏览器的宽度而定。 在页面演示 。

　　6. Simple CSS-based drop-down menu

　　这是一个非常基本的基于CSS的下拉菜单这对试图建立神交下拉菜单，不需要客户端脚本所涉及的技术精良。

　　7. Two Level Horizontal Navigation in CSS

　　费尔勒彼得提供一个CSS菜单和辅导创建的text-indent CSS属性。

　　8. Uberlink CSS List Menus

　　这个CSS的导航栏的外观和行为像一个图像交换菜单。

　　9. CSS-Only Accordion Effect

　　在此，你将看到一个用于创建一个CSS方法的手风琴菜单技术。

　　10. Tabbed Navigation Using CSS