IE7,6与Fireofx CSS对浏览器的兼容性性处理( 二 ) _云知道

②作为外部 wrapper 的 div 不要定死高度,为了让高度能自动适应，要在wrapper里面加上overflow:hidden; 当包含float的 box的时候，高度自动适应在IE下无效，这时候应该触发IE的layout私有属性(万恶的IE啊！)用zoom:1;可以做到，这样就达到了兼容。例如某一个wrapper如下定义： .colwrapper{ overflow:hidden; zoom:1; margin:5px auto;}

③对于排版,我们用得最多的css描述可能就是float:left.有的时候我们需要在n栏的float div后面做一个统一的背景,譬如: div id=page div id=left/div div id=center/div div id=right/div /div 比如我们要将page的背景设置成蓝色,以达到所有三栏的背景颜色是蓝色的目的,但是我们会发现随着left center right的向下拉长,而 page居然保存高度不变,问题来了,原因在于page不是float属性,而我们的page由于要居中,不能设置成float,所以我们应该这样解决 div id=page div id=bg style=float:left;width:100% div id=left/div div id=center/div div id=right/div /div /div 再嵌入一个float left而宽度是100%的DIV解决之

④万能float 闭合(非常重要!) 关于 clear float 的原理可参见 [How To Clear Floats Without Structural Markup],将以下代码加入Global CSS 中,给需要闭合的div加上 class=clearfix 即可,屡试不爽. /* Clear Fix */ .clearfix:after { content:.; display:block; height:0; clear:both; visibility:hidden; } .clearfix { display:inline-block; } /* Hide from IE Mac */ .clearfix {display:block;} /* End hide from IE Mac */ /* end of clearfix */ 或者这样设置：.hackbox{ display:table; //将对象作为块元素级的表格显示}

9.高度不适应高度不适应是当内层对象的高度发生变化时外层高度不能自动进行调节，特别是当内层对象使用margin 或padding 时。例： #box {background-color:#eee; } #box p {margin-top: 20px;margin-bottom: 20px; text-align:center; } div id=box pp对象中的内容/p /div 解决方法：在P对象上下各加2个空的div对象CSS代码：.1{height:0px;overflow:hidden;}或者为DIV加上 border属性。

10 .IE6下为什么图片下有空隙产生解决这个BUG的方法也有很多,可以是改变html的排版,或者设置img 为display:block 或者设置vertical-align 属性为 vertical-align:top | bottom |middle |text-bottom 都可以解决.

11.如何对齐文本与文本输入框加上 vertical-align:middle; style type=text/css !-- input { width:200px; height:30px; border:1px solid red; vertical-align:middle; } -- /style

12.web标准中定义id与class有什么区别吗一.web标准中是不容许重复ID的,比如 div id=aa 不容许重复2次,而class 定义的是类,理论上可以无限重复, 这样需要多次引用的定义便可以使用他. 二.属性的优先级问题 ID 的优先级要高于class,看上面的例子三.方便JS等客户端脚本,如果在页面中要对某个对象进行脚本操作,那么可以给他定义一个ID,否则只能利用遍历页面元素加上指定特定属性来找到它,这是相对浪费时间资源,远远不如一个ID来得简单.

13. LI中内容超过长度后以省略号显示的方法此方法适用与IE与OP浏览器 style type=text/css !-- li { width:200px; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; overflow: hidden; } -- /style

16.为什么web标准中IE无法设置滚动条颜色了解决办法是将body换成html !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Strict//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd meta http-equiv=Content-Type content=text/html; charset=gb2312 / style type=text/css !-- html { scrollbar-face-color:#f6f6f6; scrollbar-highlight-color:#fff; scrollbar-shadow-color:#eeeeee; scrollbar-3dlight-color:#eeeeee; scrollbar-arrow-color:#000; scrollbar-track-color:#fff; scrollbar-darkshadow-color:#fff; } -- /style

14.为什么无法定义1px左右高度的容器 IE6下这个问题是因为默认的行高造成的,解决的方法也有很多,例如:overflow:hidden | zoom:0.08 | line-height:1px

IE7,6与Fireofx CSS对浏览器的兼容性性处理( 二 )

推荐阅读

抖音酸菜鱼是什么梗抖音人人皆是酸菜鱼又酸又菜又多余

秋天来了有哪些景色

怎么分辨冰种翡翠，冰种翡翠辨别

保险合同终止是什么

姐姐对弟弟有抚养义务吗

一见钟情的情侣签名直戳人心的情侣签名2022

炝肉怎么做炝肉如何做

生栗子剥皮的快速方法生栗子剥皮快速的方法

元素周期表51 元素周期表51是

微信离线消息保存多久

秋季温度低钓鱼时用什么小药，中秋天凉了用什么饵料钓鲤鱼有奇效

苏州外企撤离房价居然大涨,为什么近期苏州房价大涨

小狮子手环松了怎么办怎么装小狮子手环扣子

汗是甜的是怎么回事

yunos系统root原理,YunOS系统root权限

这个测试告诉我们维护婚姻的关键该不该离婚心理测试