首页 > 代码库 > html 兼容性问题及一些处理方法(1)

html 兼容性问题及一些处理方法(1)



兼容性问题:

计算一定要精确 要要让内容的宽度超出我们设置的宽高,在IE6下,内容会撑开设置好的宽高;;

在IE6元素浮动,如果宽度需要内容撑开,就给里面的块元素都加浮动;

在IE6,7下元素要通过浮动并在一行,就给这行元素都加上浮动;

注意标签嵌套规范;

IE6下最小高度问题,在IE6下元素的高度小于19px时,游览器会将其当做19px来处理,接解决办法:overflow:hidden;

1 px dotted在IE下不支持;至少大于等于2px;解决办法 截图片 平铺;

在IE6下解决margin传递要触发haslayout,在IE6下父级有边框的情况下,子元素的margin值消失了,解决办法还是去触发haslayout,尽量触发haslayout写上zoom:1;

IE6下双边距问题margin值,在IE6下,块元素有浮动或横向的margin值会被放大成两倍,解决办法:display:inline;

margin-right 一行右侧第一个元素有双边距,margin-left 一行左侧第一个元素有双边距;

在IE6,7下,li本身没浮动,但li的内容有浮动,li下边就会产生一个间隙,解决办法:1.给li加浮动 2.给li加垂直的对其方式vertical-algin:top;

在IE6下最小高度问题,和li的间隙问题共存的时候,给li加浮动;

当一行子元素占有的宽度之和和父级的宽度相差3px,或者不满行状态的时候,最后一行子元素的下margin在IE6下就会失效

IE6下的文字溢出BUG,子元素的宽度和父级的宽度相差小于3px的时候,两个浮动元素中间有注释或者内嵌元素,解决版本:用div将注释和内嵌元素包起来

当浮动元素和绝对定位元素是并列关系的时候,在IE6下绝对元素会消失,解决办法:给定位元素外面包个div

在IE6,7下,子元素有相对定位的话,父级的overflow就包不住子元素了,解决办法:给父级也加相对定位;

在IE6下绝对定位元素的父级宽度时奇数的时候,元素的right值和bottom值会有1px的偏差。

不要给Tbody和Thead 加样式,IE6下不兼容;

在IE6,7下输入类型的表单控件上下各有1px的间隙;解决办:给input加浮动;

在IE6,7下输入类型的表单控件加border:none;无效果;解决办法给input重新加背景

在IE6,7下输入类型的表单控件输入文字的时候背景图片会跟着一块移动;解决办法:加给父级,清除自己的background:none,父级宽度和自己宽度相同;

IE6下png图片拼接问题,会将透明图片变成不透明,使用JS来进行处理;

在IE6下没在important 后加同一样的样式,会破坏掉important的作用,按照默认的优先级顺序来走;

在IE6下用margin的负值 超出父级的部分都会被屏蔽掉,可以采用定位元素来处理

    a标签的伪类才全兼容


    元素的宽度由内容撑开

display:inline;

display:inline-block;

float

position:absolute

position:fixed 不兼容


border-radius:10px 圆角

百万级别访问量的问题:

css精灵 减少网站图片的返回请求次数


html 兼容性问题及一些处理方法(1)