博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
万恶的浏览器兼容问题
阅读量:5907 次
发布时间:2019-06-19

本文共 1131 字,大约阅读时间需要 3 分钟。

一 Input 框

1.谷歌火狐通过border:none; 可以去掉边框,ie6则不行,必须加一句 background:none;

如果需要背景颜色可以重新写一个input{ background:red;}

2.谷歌火狐input内部文字自动垂直居中(不需要设置line-hight),而ie不是。兼容IE需要加上一下 input { hight:30px;linehight:30px\9;} (其中\9是指所有ie浏览器)。

二. ie6的双边距bug。

块状使用了左侧浮动,浮动之后用margin-left(比如10px),则此时盒子距离左侧实际距离为20px。且如果俩盒子同事左浮,只有最左边的有双边距现象。

解决方法:在css属性加上 display:inline-block;(display设置为inline后,就改变了BUG产生的条件之一,即必须是块状元素。但是后来又看到了下面这段话:熟悉规则的人知道浮动元素自动设置为”block”元素,而不管他们之前是什么。这说明浮动元素上的{display: inline;}会被忽略,事实上所有的浏览器没有呈现任何改变,包括IE。但是,它不知何故让IE停止将浮动元素的边界翻倍。

三.Overflow :hidden

1,在ie7下,button

中文字越多则button两侧的padding越大,此时给button加上Overflow :hidden可以使不同文字但button的padding值一样大。

2.ie6 不支持overflow:hidden 清除浮动。

四.滚动条滚动高度

1. 怪异模式的浏览器(未声明DTD    

我们应该使用  document.body.scrollTop          scrollLeft

2. 标准模式的浏览器

    我们应该使用的是  document.documentElement.scrollTop; 

3. ie9+ 以上的版本以及正常浏览器  (除了ie678等)

我们跟提倡 使用  window.pageYOffset;         pageXOffset 

三种方法 都是 被卷去的头部写法。

我们兼容写法: 

var scrolltop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;

五.定位

1.IE6不支持固定定位。

六. 提示浏览器版本过低

[if lt IE 10]   您的浏览器版本过低,请升级。 [endif]
 
 

 

转载于:https://www.cnblogs.com/ytu2010dt/p/5031196.html

你可能感兴趣的文章
一种松耦合的分层插件系统的设计和实现
查看>>
COM编程之二 接口
查看>>
javascript实现的网页打印
查看>>
web.xml中的contextConfigLocation的作用
查看>>
java 名词解释等
查看>>
Android录音与播放 .
查看>>
SQL with(unlock)与with(readpast) (转)
查看>>
Android 下使用 JSON 实现 HTTP 请求
查看>>
Dubbo架构设计详解
查看>>
微服务理论之一:应用架构演进史
查看>>
Visual Studio的“Waiting for a required operation to complete...”问题
查看>>
(转)js弹窗&返回值(window.open方式)
查看>>
JavaScript开发规范
查看>>
(原)android修改文件所属的用户组
查看>>
Google免费的SVN服务器管理VS2010代码
查看>>
设计模式之美:Adapter(适配器)
查看>>
开启PowerDesigner15工具栏上的被禁用掉的图标
查看>>
[Asp.net]常见数据导入Excel,Excel数据导入数据库解决方案,总有一款适合你!
查看>>
file_get_contents()函数超时处理方法
查看>>
数据库分表算法
查看>>