zoukankan      html  css  js  c++  java
  • 浏览器兼容性总结,【不定期更新】

    1. ie6及以下不支持子代选择器:
    比如只匹配div下的子代标签而不是所有后代标签。
    div>a{……};
    ie7以下版本是不支持的。

    解决办法:还是老老实实给个class吧,别偷懒了。
    2. 父级div下面存在2列高度不一样的子代div时,父级div高度无法自适应。此时父级div容器不成矩形,而呈现不规则。




    解决办法如图片所示。
    3. 当父代div下放置多个子代div,切子代与父代宽度相同时,子代div容器会出现重叠现象。
    解决办法:给子代div全部加上float:left;属性即可解决问题。
     
    4. ie6中,当使用空标签时,此标签的高宽会受默认字体干扰。
    比如使用空白<li>标签做轮播按钮时,设置较小的高宽会不起作用,这是因为受到了ie6最小默认字体干扰,可能是14px或者其他。
    解决办法:给此标签加上font-size:0;
     
    5.标签层级一定要分清楚,比如当有序列表<ol>的子标签<li>外层嵌套<a>标签时,ie几乎所有版本浏览器(包括IE11)序列号都无法正常显示(全部为1).
    解决办法: 正确嵌套标签,比如把<a>标签放在<li>标签内,这其实不算bug,充其量是ie太死板。
     
    6.当发生换行时,要注意一区分是内联元素还是块级元素。
    块级元素只要不浮动,是默认换行的;当父容器宽度不够时内联元素也会换行,这种情况下,行间距在chrome和ie表现一致,火狐不一致。
    图标是块元素,文字是<a>标签即内联元素,圆点是块元素。在火狐下是这样的
     
    而在ie和chrome下是这样的:
    解决办法:
    让文字变成块元素。即display:block; 
     
    7.当需要定义cursor的url属性时,使用相对路径,chrome,FF正常,IE会失效
    解决办法:使用绝对路径。
     
    8.vertical-align属性,国产浏览器比如360、遨游都不支持数字值,支持top、middle、bottom.
     
      
     
  • 相关阅读:
    我孤独吗?我软弱吗?
    DataGrid 中的 HyperLinkColumn 如何传递多个参数?(未整理)
    C# 获取 MAC地址!
    (文本)文件操作
    ioninfinitescroll实现上拉分页加载更多
    前端面试题:防抖的实现
    vue 传送门功能,实现模态窗口
    前端面试题:节流的实现( 减少一段时间的触发频率)
    vue中的render函数
    ionic5实现tab栏切换效果
  • 原文地址:https://www.cnblogs.com/flappyCoder/p/3603328.html
Copyright © 2011-2022 走看看