关于浏览器兼容性的讨论

 浏览器兼容性也就是指针对不同的浏览器(IE,Firefox,Chrome...)显示效果可能不一致而产生浏览器和网页间的兼容问题。而目前并没有统一的工具能解决这一问题,对于前端开发人员来说浏览器的兼容性无疑是开发过程中不可逃避的也是很繁琐的步骤,那么当面对这样的问题时有哪些小技巧呢?

(1)不同浏览器对高度的识别。 所有浏览器通用:height: 100px;IE6专用:_height: 100px; *height: 100px;IE7专用:*+height: 100px;

(2)不同浏览器默认的内外边距不同。 针对这个问题,我们可以在样式表中设置*{padding:0;margin:0;},对内外边距清零来使得浏览器达到统一,这样就不会出现不同浏览器可能出现的内外边距导致的问题。

(3)Firefox下给div设置padding后会导致width和height相应的增加,但是IE不会。 这样的话就可以用!important来解决,因为ie6浏览器不识别!important属性,这样css可以设置width:100px !important;width: 120px;padding:0 10px;

(4)margin加倍的问题。 设置float的div在ie下设置的margin会加倍,这其实是一个ie的bug。如果出现这个问题我们可以对div设置display:inline;这样的话ie就不会显示加倍问题了。<br /> block与inline两个元素:block元素的特点是占满一行,也就是下一个元素会换行,但高度,宽度,行高,边距都可以控制(块元素);Inline元素的特点是不会占满一行会和其他元素在同一行上,不可控制(内嵌元素);

(5)最小宽度与高度的问题。 ie不识别min-这个定义的,在ie里面就会把width,height当做min-width,min-height来使用,如果只在样式里面定义min-width,min-height的话,这样在ie里面就识别不出从而没有宽和高了。所以在设置最小宽和高的时候可以设置宽和高自动。

时间: 2024-11-01 14:13:50

关于浏览器兼容性的讨论的相关文章

如何用!important解决浏览器兼容性问题

"!important"是什么? 第一个,是设置样式的优先级,设了!important的样式的属性优先于id选择器和class选择器.,比如id为"Main"的div在它的Class设背景色为红色,,id选择器下又设了背景色为蓝色,照css的"就近原则",它的背景色应该是红色了,因为id选择器的优先级高于class选择器,但是,一旦class里设了"!important",哈哈,id,一边去吧..我背景颜色要优先显示class

jQuery学习笔记之jQuery+CSS3的浏览器兼容性_jquery

CSS3充分吸收多年了web发展的需求,吸收了很多新颖的特性.例如border-radius css3特性中最令人兴奋的莫过于选择器的增强,例如属性选择器可以根据某个属性值来选择标记,位置选择器可以根据子元素的位置来选择标记. 在目前很多使用的很多浏览器,例如IE7,主要支持css2.大部分属性选择器都不理想. 正是因为浏览器对css3的兼容性问题.各个浏览器都未对其做更好的标准支持. jQuery通过预先的javascript编程,提供了几乎所有css3标准下的选择器.开发者可以利用这些选择器

Web字体格式介绍及浏览器兼容性一览

目前,文字信息仍是网站最主要的内容,随着CSS3技术的不断成熟,Web字体逐渐成为话题,这项让未来Web更加丰富多彩的技术拥有多种实现方案,其中之一是通过@font-face属性在网页中嵌入自定义字体,主流的浏览器都支持这项技术,本文介绍主要的几种Web字体格式及各浏览器兼容情况. Web字体格式介绍TrueType (.ttf) Windows和Mac系统最常用的字体格式,其最大的特点就是它是由一种数学模式来进行定义的基于轮廓技术的字体,这使得它们比基于矢量的字体更容易处理,保证了屏幕与打印输

win8PC浏览器兼容性抽查测试

  对于软件的Win8兼容性测试,测试的根本就在于反映出在用户使用Windows平台的软 件,在最新的Win8操作系统中普遍的兼容能力.也就是说我们需要从人们最常用和最实用的软件入手,而浏览器相信是任何平台都无法或缺的最常用.实用的软 件之一.因此测试PC浏览器的兼容问题是一个比较具有普遍代表性的方向.这里我们从众多的浏览器中抽查其中三款PC浏览器软件,并关注一下它们的兼容性表现. 浏览器就是可以显示网页服务器或者文件系统的HTML文件内容,并让用户与这些文件交互的一种软件.网页浏览器用来显示在

IETester中文免费版 – 最佳网页IE浏览器兼容性测试工具

IETester中文免费版 – 最佳网页IE浏览器兼容性测试工具(IE6 IE7 IE8共存) 对于很多拥有自己博客或者接触网页制作的朋友,肯定会遇到自己辛苦写好的页面在不同的浏览器下显示出来的效果截然不同吧,喜欢追求完美的朋友就肯定希望能尽量在不同浏览器下对页面进行测试并保证其正常显示了.当然,像FireFox.Safari.Opera等浏览器还可以随意地安装卸载,然而,最麻烦的莫过于微软的"IE"系列了. 基本上你不能用常规的方法同时在一个系统中安装IE5.IE6.IE7甚至IE8

jQuery插件里的opacity属性的浏览器兼容性

文章简介:opacity这个属性的作用是设置元素的透明度的问题的.不是一个很常用的属性,却是一个不得不注意的会引起浏览器兼容性问题的属性. opacity这个属性的作用是设置元素的透明度的问题的.不是一个很常用的属性,却是一个不得不注意的会引起浏览器兼容性问题的属性看在chrome浏览器里: 三张图片,透明度是不同的,而在ie6-8的浏览器里, opacity的浏览器兼容性如下图: 补充一下:ie9已经支持opacity这个属性了.. ie6-8浏览器不支持opacity这个属性,但是没关系,我

Javascript解决浏览器兼容性问题

兼容性问题是由于多个浏览器同时存在而导致的.这些浏览器在处理一个相同的页面时,表现有时会有差异.这种差异可能很小,甚至不会被注意到:也可能很大,甚至造成在某个浏览器下无法正常浏览.我们把引起这些差异的问题统称为"浏览器兼容性问题".下面让我们一起来看Javascript在解决兼容性问题上的方法. 1. document.form.item 问题 问题: 代码中存在 document.formName.item("itemName") 这样的语句,不能在FF下运行 解

Firefox浏览器兼容性检测工具:Compatibility Detector

文章描述:Firefox下的浏览器兼容性检测工具--Compatibility Detector. 这里给大家推荐一个Firefox下的浏览器兼容性检测工具--Compatibility Detector.这个工具对于新手来说是非常不错的一个东东,下面我就简单说下它的优点. 作为一个前端开发者来说,最痛苦的事情之一就是要兼容现在各种五花八门的浏览器,而在实际的调试中这个调试过程又是让人劳心劳力.而Compatibility Detector能把目前很多已知的兼容性问题很easy的展现在我们面前.

13个不同浏览器兼容性测试的免费软件工具

前端开发人员最头疼的,莫过于形形色色的浏览器间的兼容性问题.每天绞尽脑汁地为这些本不应该存在的东西费尽心思.由于各个浏览器内核及解析方式的不同,使得相同的前端代码不能实现相同的效果.所以,培养良好标准的代码编写习惯的同时,熟练掌握浏览器兼容性测试的常用工具也是必需的了.这里是网络上传播较多的13个不同操作系统中各色浏览器兼容性测试的软件工具. HTML和CSS验证 首先让我们先看一看检查验证HTML与CSS的方法.我应该说到的是由于我在MAC上工作,会略微偏向于MAC.不要担心,仍然有许多平台独