一、 png24位的图片在IE6浏览器上出现背景,解决方案是做成PNG8.也可以引用一段脚本处理.

二、浏览器默认的margin和padding不同。解决方案是加一个全局的*{margin:0;padding:0;}来统一。

三、IE6双边距bug:块属性标签float后,又有横行的margin情况下,在IE6显示margin比设置的大。

四、浮动ie产生的双倍距离(IE6双边距问题:在IE6下,如果对元素设置了浮动,同时又设置了margin-left或margin-right,margin值会加倍。)

    #box{ float:left; width:10px; margin:0 0 0 100px;}

  这种情况之下IE会产生20px的距离,解决方案是在float的标签样式控制中加入 ——_display:inline;将其转化为行内属性。(_这个符号只有ie6会识别)

五、渐进识别的方式,从总体中逐渐排除局部。

  首先,巧妙的使用“\9”这一标记,将IE游览器从所有情况中分离出来。
  接着,再次使用“+”将IE8和IE7、IE6分离开来,这样IE8已经独立识别。

  CSS:
    .bb{
      background-color:#f1ee18;/*所有识别*/
      .background-color:#00deff\9; /*IE6、7、8识别*/
      +background-color:#a200ff;/*IE6、7识别*/
      _background-color:#1e0bd1;/*IE6识别*/
     }

六、IE下,可以使用获取常规属性的方法来获取自定义属性,也可以使用getAttribute()获取自定义属性;Firefox下,只能使用getAttribute()获取自定义属性.
  解决方法:统一通过getAttribute()获取自定义属性.

七、IE下,event对象有x,y属性,但是没有pageX,pageY属性; Firefox下,event对象有pageX,pageY属性,但是没有x,y属性.

  解决方法:(条件注释)缺点是在IE浏览器下可能会增加额外的HTTP请求数。

八、Chrome 中文界面下默认会将小于 12px 的文本强制按照 12px 显示,

  可通过加入 CSS 属性 -webkit-text-size-adjust: none; 解决.

超链接访问过后hover样式就不出现了,被点击访问过的超链接样式不在具有hover和active了解决方法是改变CSS属性的排列顺序:
  L-V-H-A : a:link {} a:visited {} a:hover {} a:active {}

十、怪异模式问题:漏写DTD声明,Firefox仍然会按照标准模式来解析网页,但在IE中会触发怪异模式。为避免怪异模式给我们带来不必要的麻烦,最好养成书写DTD声明的好习惯。现在可以使用[html5](http://www.w3.org/TR/html5/single-page.html)推荐的写法:`<doctype html>`

十一、上下margin重合问题
  IE和Firefox都存在,相邻的两个div的margin-left和margin-right不会重合,但是margin-top和margin-bottom却会发生重合。
  解决方法,养成良好的代码编写习惯,同时采用margin-top或者同时采用margin-bottom。
十二、IE6对png图片格式支持不好(引用一段脚本处理)
十三、解释下浮动和它的工作原理?清除浮动的技巧

  浮动元素脱离文档流,不占据空间。浮动元素碰到包含它的边框或者浮动元素的边框停留。

  1.使用空标签清除浮动。
   这种方法是在所有浮动标签后面添加一个空标签 定义css clear:both. 弊端就是增加了无意义标签。
  2.使用overflow。
    给包含浮动元素的父标签添加css属性 overflow:auto; zoom:1; zoom:1用于兼容IE6。
  3.使用after伪对象清除浮动。
    该方法只适用于非IE浏览器。具体写法可参照以下示例。使用中需注意以下几点。一、该方法中必须为需要清除浮动元素的伪对象中设置 height:0,否则该元素会比实际高出若干像素;

转载于:https://www.cnblogs.com/wendy-home-5678/p/6436091.html

一些常见的兼容性问题相关推荐

  1. 我所碰到的面试题之------前端常见浏览器兼容性问题解决方案---

    我所碰到的面试题之------前端常见浏览器兼容性问题解决方案--- 参考文章: (1)我所碰到的面试题之------前端常见浏览器兼容性问题解决方案--- (2)https://www.cnblog ...

  2. 常见浏览器兼容性问题及解决方案

    常见浏览器兼容性问题及解决方案: 1.不同浏览器的默认内外边距和内外补丁不同. 解决方案:css设置 *{margin:0; padding:0;} *是通配符,匹配所有html标签. 2.块级元素f ...

  3. IE浏览器常见CSS兼容性问题及解决办法

    IE浏览器常见CSS兼容性问题及解决办法 参考文章: (1)IE浏览器常见CSS兼容性问题及解决办法 (2)https://www.cnblogs.com/kiscall/p/4679616.html ...

  4. 常见浏览器兼容性问题大全

    常见浏览器兼容性问题与解决方案 所谓的浏览器兼容性问题,是指因为不同的浏览器对同一段代码有不同的解析,造成页面显示效果不统一的情况.在大多数情况下,我们的需求是,无论用户用什么浏览器来查看我们的网站或 ...

  5. html select ios 闪屏,移动端常见的兼容性问题.md

    # 移动端常见的兼容性问题 ###### 1. meta 基础知识点如下 ``` // 启动或禁用自动识别页面中的电话号码 // 启动或禁用自动识别邮箱地址 // 设置 Web 应用是否以全屏模式运行 ...

  6. 【转】常见浏览器兼容性问题与解决方案css篇

    小满语:说到兼容性问题,不得不说一下IE浏览器,尤其是IE9以前,兼容性差的要哭,来,擦擦眼泪,学习一下兼容性问题的解决方案~本篇主要是布局后加样式后导致浏览器显示不统一的情形: 所谓的浏览器兼容性问 ...

  7. 常见浏览器兼容性问题与解决方案

    2019独角兽企业重金招聘Python工程师标准>>> 所谓的浏览器兼容性问题,是指因为不同的浏览器对同一段代码有不同的解析,造成页面显示效果不统一的情况.在大多数情况下,我们的需求 ...

  8. 常见浏览器兼容性问题与解决方式

    所谓的浏览器兼容性问题,是指由于不同的浏览器对同一段代码有不同的解析,造成页面显示效果不统一的情况.在大多数情况下,我们的需求是,不管用户用什么浏览器来查看我们的站点或者登陆我们的系统,都应该是统一的 ...

  9. 常见浏览器兼容性问题与解决方案?

    (1)浏览器兼容问题一:不同浏览器的标签默认的外补丁和内补丁不同  问题症状:随便写几个标签,不加样式控制的情况下,各自的margin 和padding差异较大. 碰到频率:100% 解决方案:CSS ...

  10. 常见浏览器兼容性问题和解决方案

    持续更新~ 常见的浏览器IE.Firefox.Chrome等主流浏览器兼容性问题和解决方案: 1,各浏览器默认的margin/padding值不同 解决方案:共通css里头部加上 * {margin: ...

最新文章

  1. 选型必看:RabbitMQ 七战 Kafka,差异立现
  2. Python 学习之中的一个:在Mac OS X下基于Sublime Text搭建开发平台包括numpy,scipy
  3. 详解--单调队列 经典滑动窗口问题
  4. 高德sdk_联手HERE,高德进军地图海外市场 | CES 2020
  5. Python数模笔记-PuLP库(1)线性规划入门
  6. Oracle审计功能
  7. Java JSON库Jackson 2 x新变化一览
  8. 联想笔记本连不上手机热点_购买低配笔记本电脑的烦恼:实际重装笔记本系统的辛酸血泪史...
  9. Java中的四种内部类
  10. 如何在mysql命令窗口获取到程序正在执行的sql语句
  11. word转html在前端页面显示
  12. python saveas_Python中正确的Save-As函数
  13. windows 10屏蔽系统自动更新
  14. visual studio 总是和搜狗输入法冲突
  15. 在Sbo Add-on插件中实现通用的模态数据选择
  16. 大侠周鸿祎——腾讯,你丫动手吧!
  17. 数据分析真题日刷 | 京东2019春招京东数据分析类试卷
  18. 查看表空间使用率(包括临时表空间)
  19. 微信小程序 Springboot校运会高校运动会管理系统
  20. Linux基础命令大全(详细版)

热门文章

  1. 仓储系统java_Java的最全最细的学习路线图,助你早日斩获心仪的Offer
  2. python不满足条件重新输入_在python里为何不满足while条件,while里语句却可以执行?...
  3. bootstrap后台模板_免费bootstrap后台管理系统模板源码 网站后台模板_后台管理界面...
  4. python3.x版本的保留字总数是多少_Python3.6.5版本的保留字总数是:()-智慧树大数据分析的python基础章节答案...
  5. java红包雨_Java升职加薪课开发企业年会红包雨场景项目实战视频教程
  6. linux中spawn远程执行,linux 远程登录执行命令
  7. php启用openssl,php怎么开启openssl模块
  8. velocity参数重新赋值_Velocity(5)——#set指令
  9. php文件怎么阅读器,Vue文件阅读器组件FileReader API
  10. 惠普战66怎么用u盘进入系统_惠普笔记本怎么用u盘启动装系统,空间也要大所以超来超受欢迎!...