个人总结 css 浏览器兼容常见问题总结方法

1.如何让整个界面不出现滚动条，铺满整个浏览器。
方法；在body中加overflow: hidden;有时候会出现底部有一段的空白，解决方法在form中加overflow: hidden;。

2.height：100%或者是width：100% 一加这个就会出现滚动条，除非控制。

3.IE显示下有时候字体会比其他浏览器显示的要小，解决方法：用IEhack区分不同浏览器

font-size:10px; 所有浏览器都可识别
font-size:10px\9;所有IE浏览器都可识别
font-size:10px !important;除IE6不能识别 !important外, FF+IE8+IE7都能识别!important（专属用于给火狐浏览器来控制显示）

4.只有IE浏览可以识别，其他浏览器不可以识别的方法：在属性后面加上\9

font-size:10px\9;

5.css中常用的特殊字符识别表

CSS中常用特殊字符识别表:
(1)*: IE6+IE7都能识别*,而标准浏览器FF+IE8是不能识别*的;
(2)!important: 除IE6不能识别 !important外, FF+IE8+IE7都能识别!important ;
(3)_ : 除IE6支持_ 外, FF+IE8+IE7都不支持_;
(4)\9:所有IE浏览器都识别(IE6、IE7、IE8、IE9)

6.关于伪元素的使用
：first 和 ：：first浏览器都可以兼容，但是IE8只识别:first用法，故一般选择前者使用方法。

7.overflow 要起作用的话，要对该元素设定高度，不然无法起作用。
。

9.IE 中不支持JQUERY中的trim(), 解决方法用$.trim(),所有的浏览器都支持
如 a.trim() 可变为 var s = $.trim(a)

时间： 2024-10-09 16:55:50

个人总结 css 浏览器兼容常见问题总结方法的相关文章

CSS浏览器兼容

CSS 浏览器兼容知识汇总 CSS技巧 1.div的垂直居中问题 vertical-align:middle; 将行距增加到和整个DIV一样高line-height:200px; 然后插入文字,就垂直居中了.缺点是要控制内容不要换行. 2.margin加倍的问题 问题描述:设置为float的div在ie下设置的margin会加倍.这是一个ie6都存在的bug. 解决方案:在这个div里面加上display:inline; 示例讲解:<div id="imfloat"><

CSS浏览器兼容问题总结

为什么会出现浏览器兼容问题? 由于各大主流浏览器是不同的厂家开发的,所以使用的核心也不相同,架构代码很难重合,就会产生各种各样的bug. IE6中常见的css解析bug 1)默认高度(IE6)部分块元素会拥有默认的高度 hack1:给元素添加声明:font-size:0: hack2:给元素添加声明:overflow:hidden: 2)各浏览器的按钮大小不一样/边框显示不一样 hack:统一大小(宽和高): hack1:给input外边加一个标签,给标签加边框,再取消input的默认边框: h

js 浏览器兼容的一些方法

使用js是一件令人很抓狂的事情,很多的浏览器兼容,一大推的代码,谁的脑袋能记住那么多的东西,只有平时多积累,所谓熟能生巧嘛..这里列出一些常用的兼容代码,一点点积累哈~~~ 一.以跨浏览器的方式处理事件.这个叫EventUtil对象定义了一些方法,用来处理各浏览器之间的差异. var EventUtil={ addHandler:function(element,type,handler){//绑定事件 if(element.addEventListener){ element.addEvent

CSS浏览器兼容性与解决方法

一.什么是浏览器兼容性问题? 所谓的浏览器兼容性问题,是指不同的浏览器对同一段代码有不同的解析,造成页面显示效果不统一的情况:而造成浏览器兼容问题的根本原因,是浏览器的内核不同导致的.认识浏览器内核   浏览器类型            内核                        JS引擎   IE                      Trident                     JScript   Firefox                 Gecko       

css 浏览器兼容解决方法大全

1.Firefox @-moz-document url-prefix() { .selector { property: value; } } 上面是仅仅被Firefox浏览器识别的写法,具体如: @-moz-document url-prefix() { .demo { color:lime; } } 支持Firefox的还有几种写法: /* 支持所有firefox版本 */ #selector[id=selector] { property: value; } 或者: @-moz-docu

scss、less 对浏览器兼容的处理方法, css 的单行溢出、多行溢出

1. scss @mixin rounded($param1,$param2) { #{$param1}:$param2; -webkit-#{$param1}: $param2; -moz-#{$param1}: $param2; -ms-#{$param1}: $param2; -o-#{$param1}:$param2; } 使用方法: @include rounded(transition,all 0.3s); 2.less .promise(@css, @args) { @{css}:

【引用】CSS浏览器兼容手册

CSS技巧 1.div的垂直居中问题vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了.缺点是要控制内容不要换行 2. margin加倍的问题    设置为float的div在ie下设置的margin会加倍.这是一个ie6都存在的bug.解决方案是在这个div里面加上display:inline;   例如:    <#div id=”imfloat”>    相应的css为   #IamFloat{ 

CSS浏览器兼容问题集(一）

CSS对浏览器的兼容性有时让人非常头疼,也许当你了解其中的技巧跟原理,就会认为也不是难事,从网上收集了IE7,6与Fireofx的兼容性处理方法并整理了一下.对于web2.0的过度,请尽量用xhtml格式写代码,并且DOCTYPE 影响 CSS 处理,作为W3C的标准,一定要加DOCTYPE声名 CSS技巧 1.div的垂直居中问题 vertical-align:middle; 将行距添加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了. 缺点是要控制内容不

javascript和css浏览器兼容问题总结

一些浏览器兼容性问题下面做一个总结: 为什么会出现这种现象呢?主要就是像Firefox这样浏览器良好支持W3C标准,是目前对CSS支持最好的浏览器,而ie是出现的比较早,在w3c支持方面做的一直不是很好.有很多东西出现FF和IE显示不一样的根本原因在于它们的默认显示不一样,而这个默认样式该如何显示我知道在w3中有没有对应的标准来进行规定. 下面总结一下这两种浏览器的兼容问题: 1.HTML对象获取问题 FireFox:document.getElementById("idName");