9、IE浏览器兼容问题

兼容性:页面在不同的浏览器上可能显示不同;

    1、在IE6下,子集的宽度会撑开父级设置好的宽度;
         温馨提示:盒模型的计算一定要精确,否则IE浏览器可能会显示不同;
    2、在IE6中,元素浮动,如果宽度需要内容撑开,需要给里面的块元素都添加浮动才可以;
    3、在IE6、7下,元素要通过浮动排在同一排,就需要给这行元素都加浮动;
    4、注意标签的嵌套规则;
    5、在IE6下,元素的高度如果小于19px,会被当成19px来处理;    
          解决方法:overflow:hidden;
    6、在IE6下,不支持1px的dotted边框样式;
          解决 方法:切背景平铺;
    7、在IE下,大部分兼容性都是因为haslayout属性的触发问题,尽量触发haslayout属性,可以减少很多IE下的兼容问题;
          在IE下,父级有边框的时候,子元素的margin会失效;
          解决方法:触发父级的haslayout属性;
    8、IE6下双边 距的bug;
          在IE6下,块元素有浮动有横向的margin的值的时候,横向的margin的值会扩大两倍;
    9、IE6下,margin-left 一行中左侧的第一个元素有双边距;margin-right 一行中右侧的第一个元素有双边距;
    10、在IE6、7下,li本身没有浮动,li里面的内容有浮动,li下会产生一个间隙;
          解决方法:1、给li加浮动;2、给li加vertical-align:top;
    11、在IE6下,最小高度的bug和li的间隙问题共存的时候,给li加浮动,vertical-align:top不好使;
    12、当一行子级元素宽度之和和父级的宽度相差超过3px,或者子级元素不满行的情况时,最后一行的子级元素的margin-bottom会失效;(尽量避免)
    13、在IE6下,文字溢出bug;
          子元素的宽度和父级的宽度相差如果小于3px,两个浮动元素中间有注释或者内联元素,就会出现文字溢出,内联元素越多,溢出越多;
          解决方法:用div把注释或者内联元素包起来;
    14、在IE6下,当浮动元素和绝对定位是兄弟关系时,绝对定位会失效;
          解决方法:不让浮动元素和绝对定位是兄弟关系,用div或者其他标签把元素包起来;
    15、在IE6、7下,子级元素有相对定位,父级overflow包不住子级元素;
          解决方法:给父级也加上相对定位;
    16、在IE6下,如果绝对定位的父级的宽高是奇数的时候子级元素的right和bottom值会有1px的偏差;
    17、在IE6下,固定定位fixed不好使;透明度opacity:值(0~1)不好使,用filter:alpha(opacity=50)设置;
    18、在IE6、7下,输入型的表单标签上下会有1px的间隙;
          解决方法:给input加浮动;
    19、图片半透明(png 24),IE6不兼容;
          解决方法:借助文件 DD_belatePNG_0.0.8a.js;
    20、在IE下,条件注释语句可以显示
          <!-- [if ie 6/7/8]>
                我是IE6
          <![endif]-->
    21、css hack
          background:red; 
          _background:yellow;  // IE6及以下
          + background:yellow; // 或* IE7及以下
          background:yellow\9; // IE9及以下         
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 158,847评论 4 362
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,208评论 1 292
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 108,587评论 0 243
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,942评论 0 205
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,332评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,587评论 1 218
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,853评论 2 312
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,568评论 0 198
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,273评论 1 242
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,542评论 2 246
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,033评论 1 260
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,373评论 2 253
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,031评论 3 236
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,073评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,830评论 0 195
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,628评论 2 274
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,537评论 2 269

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,629评论 1 92
  • 序章 谈谈“浏览器兼容性”的问题?很多前端的面试或笔试中,都有比较笼统的“说说你所知道的各浏览器存在的兼容问题”,...
    麻辣小隔壁阅读 2,991评论 1 57
  • 前言 浏览器的兼容性问题是个很庞大复杂的问题,很难找到四海皆准的办法,这里我们只是简单介绍下几种经典的处理兼容性问...
    浪里行舟阅读 1,318评论 1 14
  • 对于浏览器兼容问题,我们应该碰到很多了,在平时写一些页面时,在IE8、IE9上可能好好的,当我们在IE6、IE7或...
    恩德_b0c2阅读 1,370评论 0 2
  • 浏览器兼容性问题又被称为网页兼容性或网站兼容性问题,指网页在各种浏览器上的显示效果可能不一致而产生浏览器和网页间的...
    路西法丶L阅读 431评论 0 1