室内设计培训
平面设计培训
部落窝教育
网站首页 >> 设计在线 >> 文章内容

div+css网页布局常见错误及预防

[日期:2010-07-16]   来源:IT部落窝  作者:IT部落窝   阅读:1678[字体: ]

  IT部落窝www.ittribalwo.com)小编给大家罗列出了一些DIV+CSS设计页面时的常见错误及预防技巧,希望能对大家有所帮助。

  div+css网页布局常见错误一:
  检查HTML元素是否有拼写错误、是否忘记结束标记。即使是老手也经常会弄错div的嵌套关系。可以用dreamweaver的验证功能检查一下有无错误。

  div+css网页布局常见错误二:
  检查CSS是否正确:检查一下有无拼写错误、是否忘记结尾的} 等。可以利用CleanCSS来检查 CSS的拼写错误。CleanCSS本是为CSS减肥的工具,但也能检查出拼写错误。

  div+css网页布局常见错误三:
  确定错误发生的位置:假如错误影响了整体布局,则可以逐个删除div块,直到删除某个div块后显示恢复正常,即可确定错误发生的位置。

  div+css网页布局常见错误四:
  利用border属性确定出错元素的布局特性:使用float属性布局一不小心就会出错。这时为元素添加border属性确定元素边界,错误原因即水落石出。

  div+css网页布局常见错误五:
  float元素的父元素不能指定clear属性:MacIE下假如对float的元素的父元素使用clear属性,四周的float元素布局就会混乱。这是MacIE的闻名的bug,倘若不知道就会走弯路。

  div+css网页布局常见错误六:
  注意float元素务必指定width属性:很多浏览器在显示未指定width的float元素时会有bug。所以不管float元素的内容如何,一定要为其指定width属性。另外指定元素时尽量使用em而不是px做单位。

  div+css网页布局常见错误七:
  注意float元素不能指定margin和padding等属性:IE在显示指定了margin和padding的float元素时有bug。因此不要对float元素指定margin和padding属性(可以在float元素内部嵌套一个div来设置margin和padding)。也可以使用hack方法为IE指定非凡的值。

  div+css网页布局常见错误八:
  确保float元素的宽度之和要小于100%:假如float元素的宽度之和正好是100%,某些古老的浏览器将不能正常显示。因此请保证宽度之和小于99%。

  div+css网页布局常见错误九:
  检查是否重设了默认的样式:某些属性如margin、padding等,不同浏览器会有不同的解释。因此最好在开发前首先将全体的margin、padding设置为0、列表样式设置为none等。

  div+css网页布局常见错误十:
  检查是否忘记了写DTD:假如无论怎样调整不同浏览器显示结果还是不一样,那么可以检查一下页面开头是不是忘了写下面这行DTD:
< ! DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 TransITional//EN\" \"http://www.w3.org/TR/html4/loose.dtd\" >

  以上10条常见错误,是在div+css网页布局时最常遇到的,大家可以参考这10条进行检查。

IT部落窝PS,CDR,213班 分享到: QQ空间 新浪微博 腾讯微博 人人网
photoshop教程
Photoshop教程
平面设计教程
Photoshop教程