前往顾页
以后地位: 主页 > 收集编程 > Asp实例教程 >

DIV布局常见错误汇总

时候:2018-12-28 13:31来源:知行网www.zhixing123.cn 编辑:麦田守望者

利用DIV布局时还带有很多操纵表格时的思惟和习惯,乃至于出了很多的错误,在此把容易出错的一些细节清算出来,希望对初学的朋友能有所帮忙。

1.最多见的DIV嵌套错误

因为Xhtml 语法比较严格,诸如Firefox 之类的浏览器如果查抄发明Xhtml内里有语法错误,那页面是不克不及一般显现的。方才开端学习DIV布局的时候常常会弄错DIV的嵌套关系。我们可以用Dreamweaver的考证服从查抄一下有没有这方面的错误。
 

2.因为大意酿成的标点错误
开端一味寻求速率,在标点方面不太重视,到最后发明有些属性不起感化。最容易出错的比方:
精确:class=” “,错误:class=“ ”(标点的中英文切换)
精确:font-size: 12px;,错误:font-size: 12px;(标点的中英文切换)
精确:text-decoration: underline;,错误:text_decoration: underline;(是中划线而非下划线)
精确:img {border: 0;}错误:img {border: 0; (重视后边的”}”标记)
精确:<br /><img /><hr />错误:<br><img><hr>(这个错误只是个不好的习惯,不适合标准的写法,这类单标签必然要闭合)

3.在利用float元素时呈现内容撑开的问题
在利用左浮动或右浮动的时候必然要包管float元素的宽度之和小于或即是100%,一般比较保险的做法是要小于98%。

4.float元素的父元素不克不及指定clear属性
在MacIE下如果对float的元素的父元素利用clear属性,四周的float元素布局就会混乱。这是MacIE的驰名的bug,借使假如不晓得就会走弯路。

5.从头定义一些默许的款式
某些属性如ul、li、margin、padding等,不合浏览器会有不合的解释。是以最幸亏开端布局之前先将全部的margin、padding设置为0;ul、li列表款式设置为none等。

6.float元素最好不要指定margin和padding属性
IE在显现指定了margin和padding的float元素时有bug。是以不要对float元素指定margin和padding属性(公道的做法:可在float元素外部嵌套一个div来设置margin和padding)。

7.float元素必然要指定width属性

很多浏览器在显现未指定width的float元素时会有bug。所以不管float元素的内容若何,必然要为其指定width属性。

8. 是不是健忘了写DTD
如果不管怎样调剂不合浏览器显现成果还是不一样,那么可以查抄一下页面开首是不是是忘了写下面这行DTD:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

最好的做法是用Dreamweaver专业软件直接新建网站页面,如许可以包管不会出错。

简朴的解除错误的一些体例:

  1. 年夜概肯定错误产生的地位
    如果因为小错误影响了团体布局,可以一一删除div块,直到删除某个div块后显现规复一般,便可肯定错误产生的地位。
  2. 操纵border属性处理Float布局错误
    利用float属性布局一不小心就会出错。这时候为相关元素增加border属性以肯定元素鸿沟,错误启事即内情毕露。
------分开线----------------------------
标签(Tag):DIV布局
------分开线----------------------------
保举内容
猜你感兴趣