影响
CSS
处理
2.FF:
div
设置
margin-left,
margin-right
为
auto
时已经居中,
IE
不行
3.FF:
body
设置
text-align
时,
div
需要设置
margin:
auto(主要是
margin-left,margin-right)
方可居中
4.FF:
设置
padding
后,
div
会增加
height
和
width,
但
IE
不会,
故需要用
!important
多设一个
height
和
width
5.FF:
支持
!important,
IE
则忽略,
可用
!important
为
FF
特别设置样式
6.div
的垂直居中问题:
vertical-align:middle
将行距增加到和整个DIV一样高
line-height:200px
然后插入文字,就垂直居中了。缺点是要控制内容不要换行
7.cursor:
pointer
可以同时在
IE
FF
中显示游标手指状,
hand
仅
IE
可以
8.FF:
链接加边框和背景色,需设置
display:
block,
同时设置
float:
left
保证不换行。参照
menubar,
给
a
和
menubar
设置高度是为了避免底边显示错位,
若不设
height,
可以在
menubar
中插入一个空格。
9.在mozilla
firefox和IE中的BOX模型解释不一致导致相差2px解决方法:
div{margin:30px!importantmargin:28px}
注意这两个margin的顺序一定不能写反,据阿捷的说法!important这个属性IE不能识别,但别的浏览器可以识别。所以在IE下其实解释成这样:
div{maring:30pxmargin:28px}
重复定义的话按照最后一个来执行,所以不可以只写margin:XXpx!important
10.IE5
和IE6的BOX解释不一致
IE5下
div{width:300pxmargin:0
10px
0
10px}
div的宽度会被解释为300px-10px(右填充)-10px(左填充)最终div的宽度为280px,而在IE6和其他浏览器上宽度则是以300px+10px(右填充)+10px(左填充)=320px来计算的。这时我们可以做如下修改
div{width:300px!importantwidth
/**/:340pxmargin:0
10px
0
10px}
关于这个/**/是什么我也不太明白,只知道IE5和firefox都支持但IE6不支持,如果有人理解的话,请告诉我一声,谢了!:)
11.ul标签在Mozilla中默认是有padding值的,而在IE中只有margin有值所以先定义
ul{margin:0padding:0}
就能解决大部分问题
什么是hasLayout?hasLayout是IE特有的一个属性。很多的ie下的css bug都与其息息相关。在ie中,一个元素要么自己对自身的内容进行计算大小和组织,要么依赖于父元素来计算尺寸和组织内容。当一个元素的hasLayout属性值为true时,它负责对自己和可能的子孙元素进行尺寸计算和定位。虽然这意味着这个元素需要花更多的代价来维护自身和里面的内容,而不是依赖于祖先元素来完成这些工作。下列元素默认 hasLayout=true
<table><td><body><img><hr><input><select><textarea><button><iframe><embed><object><applet><marquee>
很多情况下,我们把 hasLayout的状态改成true 就可以解决很大部分ie下显示的bug。
hasLayout属性不能直接设定,你只能通过设定一些特定的css属性来触发并改变 hasLayout 状态。下面列出可以触发hasLayout的一些CSS属性值。
-------------------------------------
display
启动haslayout的值:inline-block
取消hasLayout的值:其他值
--------------------------------------
width/height
启动hasLayout的值:除了auto以外的值
取消hasLayout的值:auto
---------------------------------------
position
启动hasLayout的值:absolute
取消hasLayout的值:static
----------------------------------------
float
启动hasLayout的值:left或right
取消hasLayout的值:none
---------------------------------------
zoom
启动hasLayout的值:有值
取消hasLayout的值:narmal或者空值
(zoom是微软IE专有属性,可以触发hasLayout但不会影响页面的显示效果。zoom: 1常用来除错,不过 ie 5 对这个属性不支持。)
----------------------------------------
writing-mode: tb-rl
这也是微软专有的属性。
ie7还有一些额外的属性可以触发该属性(不完全列表):
min-height: (任何值)
max-height: (任何值除了none)
min-width: (任何值)
max-width: (任何值除了none)
overflow: (任何值除了visible)
overflow-x: (任何值除了visible)
overflow-y: (任何值除了visible)