常见浏览器兼容性问题汇总.doc

合集下载

浏览器兼容性问题大汇总

浏览器兼容性问题⼤汇总

JavaScript

1.HTML对象获取问题

FireFox：document.getElementById(“idName”);

ie:document.idname或者document.getElementById(“idName”).

解决办法：统⼀使⽤document.getElementById(“idName”);

2.const问题

说明:Firefox下,可以使⽤const关键字或var关键字来定义常量;

IE下,只能使⽤var关键字来定义常量.

解决⽅法：统⼀使⽤var关键字来定义常量.

3.event.x与event.y问题

说明:IE下,event对象有x,y属性,但是没有pageX,pageY属性;

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

解决⽅法：使⽤mX(mX = event.x ? event.x : event.pageX;)来代替IE下的event.x或者Firefox下的event.pageX.

4.window.location.href问题

说明:IE或者Firefox2.0.x下,可以使⽤window.location或window.location.href;

Firefox1.5.x下,只能使⽤window.location.

解决⽅法：使⽤window.location来代替window.location.href.

5.frame问题

以下⾯的frame为例：

前端常见浏览器兼容性问题解决方案

前端常见浏览器兼容性问题解决⽅案

市场上浏览器种类很多，不同浏览器的内核也不尽相同，所以各个浏览器对⽹页的解析存在⼀定的差异。浏览器内核主要分为两种，⼀是渲染引擎，另⼀个是js引擎，内核更加倾向于说渲染引擎。

常见的浏览器内核可以分四种：Trident、Gecko、Blink、Webkit

IE浏览器：Trident内核，也称为IE内核

Chrome浏览器：Webkit内核，现在是Blink内核

Firefox浏览器：Gecko内核，俗称Firefox内核

Safari浏览器：Webkit内核

Opera浏览器：最初是⾃⼰的Presto内核，后来加⼊⾕歌⼤军，从Webkit⼜到了Blink内核；

360浏览器：IE+Chrome双内核

猎豹浏览器：IE+Chrome双内核

百度浏览器：IE内核

QQ浏览器：Trident（兼容模式）+Webkit（⾼速模式）

常见的兼容性问题：

1.不同浏览器的标签默认的外补丁（margin）和内补丁（padding）不同

解决⽅案：css⾥增加通配符*{margin：0；padding：0}

2.IE6双边距问题；在IE6中设置了float，同时⼜设置margin，就会出现边距问题

解决⽅案：设置display：inline；

3.当标签的⾼度设置⼩于10px，在IE6、IE7中会超出⾃⼰设置的⾼度

解决⽅案：超出⾼度的标签设置overflow：hidden，或者设置line-height的值⼩于你的设置⾼度

4.图⽚默认有间距

解决⽅案：使⽤float为img布局

5.IE9以下浏览器不能使⽤opacity

浏览器兼容问题参考

第5页
浏览器的兼容性问题
◆居中布局问题
对于IE，父元素用 text-align: center; 可实现父级元素内的子元素居中；
对于FF，子元素需用 margin: 0 auto;。
IE FF
css_browser_center.html
第6页
浏览器的兼容性问题
<div id="container"> <p>container</p> <div id="element">element</div> </div>
例
第21页
浏览器的兼容性问题
<div class="box"> FF红色height:200px <br/> IE7 蓝色height:200px <br/> IE6黑色height:200px<br/> </div>
第22页
浏览器的兼容性问题
IE6
FF ，IE7 css_browser_!important.html
第23页
浏览器的兼容性问题
#grayBlock{ width:520px; height:80px; background:gray; margin-top:20px; float:left; margin-left:20px; /* !important;margin-left:10px;*/ /*display:inline; */ _margin-left:10px; /* */

前端开发常见的跨浏览器兼容性问题

在前端开发中，跨浏览器兼容性问题是一项常见而又具有挑战性的任务。由于不同浏览器的设计理念、实现机制和对Web标准的支持程度都不尽相同，导致同一份代码在不同浏览器上的表现可能会有所差异甚至出现错误。有效地解决跨浏览器兼容性问题，不仅可以提升用户体验，还能保证网站在各个浏览器上都能正常运行。本文将介绍前端开发常见的跨浏览器兼容性问题，并给出相应的解决方案。

1. CSS兼容性问题

CSS兼容性问题是前端开发中最常见的问题之一。不同浏览器对CSS标准的支持程度各不相同，常见的兼容性问题包括盒模型的解析差异、浮动元素引起的布局问题、定位属性（如position和z-index）的兼容性差异等。解决这些问题的方法包括使用CSS Reset来统一不同浏览器的默认样式、选择合适的CSS选择器以确保样式的正确应用、使用浏览器前缀（-webkit-、-moz-、-o-等）来适配不同浏览器，以及使用CSS Hack和Polyfills来处理特定浏览器的兼容性问题。

2. JavaScript兼容性问题

JavaScript兼容性问题主要集中在浏览器对JavaScript标准（如ECMAScript规范）的支持程度和对各种JavaScript API（如DOM操作、AJAX、Canvas等）的实现方式上。解决这些问题的方法包括使用特性检测（feature detection）而非浏览器检测（browser detection）来判断浏览器支持的功能，使用标准的JavaScript语法和API来编写代码以确保在不同浏览器上的正常执行，同时使用浏览器兼容性库（如Modernizr、Polyfills等）来填补浏览器的功能差异。

浏览器兼容性问题的解决方案

浏览器兼容性问题的解决方案随着互联网的不断发展，浏览器已经成为人们日常生活中必不可少的工具之一。然而，不同的浏览器和浏览器版本之间的兼容性问题却给网站开发和维护带来了诸多麻烦。本文将探讨浏览器兼容性问题带来的影响以及解决方案。

一、浏览器兼容性问题的影响

1.用户体验不佳

在不同的浏览器和版本下，网站的显示效果和交互体验往往差异很大，这会导致用户在使用网站时出现卡顿、界面错乱、功能失效等问题，影响用户的使用体验。

2.网站表现不佳

由于不同的浏览器对网站代码的解释和执行方式不同，故网站在兼容性方面存在一定的缺陷。这会导致网站在某些浏览器和版本下出现性能问题，例如加载速度变慢、页面响应时间变长等。

3.网站SEO降低

由于不同的浏览器在搜索引擎中的排名不同，因此网站在兼容性方面出现问题会直接影响网站的搜索排名和SEO结果，降低网站被搜索引擎收录的概率和搜索排名。

二、1.编写符合标准的HTML、CSS和JavaScript代码

兼容性问题的主要原因是网站代码不符合标准，因此，编写符合标准的代码是避免兼容性问题的基本手段。在编写代码时要符合W3C标准，并注意不要使用浏览器非标准的属性和方法。

2.尽量避免使用特定浏览器的特定功能

尽量避免使用特定浏览器的特定功能，以避免兼容性问题。如果非常需要使用某个功能，则需要对该浏览器进行特别处理。这可以通过JavaScript语言的特异性或条件注释来实现。

3.使用开源框架

开源框架具有成熟的代码库，同时还能避免浏览器兼容性问题

的发生。常见的开源框架包括React、Angular和Vue.js等。

前端框架技术中常见的浏览器兼容性问题及解决方案

前端框架技术中常见的浏览器兼容性问题及

解决方案

在前端开发过程中，浏览器兼容性问题一直是一个头疼的难题。由于不同浏览器的渲染引擎和规范解释存在差异，导致同样的前端代码在不同浏览器上可能会呈现不同的效果甚至出现错误。为了提供用户一致的体验，我们需要了解并解决常见的浏览器兼容性问题。

一、CSS兼容性问题

1. 盒模型差异

Chrome、Firefox以及Safari使用的是W3C标准的盒模型，而IE使用的是传统的IE盒模型。解决方案是使用CSS的box-sizing属性来明确指定所使用的盒模型。

```

box-sizing: border-box; /*使用W3C的盒模型*/

box-sizing: content-box; /*使用传统的IE盒模型*/

```

2. 浮动清除

在IE6及其以前的版本中，浮动元素没有被正确的清除，可能会导致父容器的高度无法自适应。解决方案是使用clearfix类或者在父容器上添加clear属性。

```

.clearfix::after {

content: "";

display: table;

clear: both;

}

```

3. 层叠样式兼容性

不同浏览器的CSS样式的优先级计算存在差异，可能导致样式覆盖问题。解决方案是合理使用选择器和样式优先级，避免出现覆盖问题。

二、JavaScript兼容性问题

1. DOM操作差异

不同浏览器对于DOM操作的实现存在差异，可能导致相同的DOM操作代码在不同浏览器上出现错误。解决方案是使用现代的DOM操作API，如querySelector、addEventListener等，或者使用框架提供的封装方法。

最全整理浏览器兼容性问题与解决方案

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

所谓的浏览器兼容性问题，是指因为不同的浏览器对同一段代码有不同的解析，造成页面显示效果不统一的情况。在大多数情况下，我们的需求是，无论用户用什么浏览器来查看我们的网站或者登陆我们的系统，都应该是统一的显示效果。所以浏览器的兼容性问题是前端开发人员经常会碰到和必须要解决的问题。

在学习浏览器兼容性之前，我想把前端开发人员划分为两类：

第一类是精确按照设计图开发的前端开发人员，可以说是精确到1px的，他们很容易就会发现设计图的不足，并且在很少的情况下会碰到浏览器的兼容性问题，而这些问题往往都死浏览器的bug，并且他们制作的页面后期易维护，代码重用问题少，可以说是比较牢固放心的代码。

第二类是基本按照设计图来开发的前端开发人员，很多细枝末节差距很大，不如间距，行高，图片位置等等经常会差几px。某种效果的实现也是反复调试得到，具体为什么出现这种效果还模模糊糊，整体布局十分脆弱。稍有改动就乱七八糟。代码为什么这么写还不知所以然。这类开发人员往往经常为兼容性问题所困。修改好了这个浏览器又乱了另一个浏览器。改来改去也毫无头绪。其实他们碰到的兼容性问题大部分不应该归咎于浏览器，而是他们的技术本身了。

文章主要针对的是第一类，严谨型的开发人员，因此这里主要从浏览器解析差异的角度来分析兼容性问题。

浏览器兼容问题一：不同浏览器的标签默认的外补丁和内补丁不同

问题症状：随便写几个标签，不加样式控制的情况下，各自的margin 和padding 差异较大。

碰到频率:100%

解决方案：CSS里*

前端开发中的浏览器兼容性问题及解决方法

前端开发是指开发网页的前台部分，包括网页的结构、样式和交互等。在开发过程中，不同浏览器的兼容性问题是一个需要重点关注的方面。本文将探讨前端开发中的浏览器兼容性问题，并提供一些解决方法。

1. 浏览器兼容性问题的原因

虽然不同浏览器都遵循Web标准，但由于各浏览器厂商的差异，不同浏览器的渲染引擎对同一段代码可能有不同的解释和处理方式，导致页面在不同浏览器中呈现效果不同。兼容性问题的产生主要可以归结为以下几点原因：

1.1. 标准支持不全：各个浏览器对标准的理解和支持程度不尽相同，导致对标准中某些特性的实现方式存在差异。

1.2. CSS兼容性问题：不同浏览器对CSS属性的解析和渲染方式存在差异，导致样式在不同浏览器中显示效果不同。

1.3. JavaScript兼容性问题：不同浏览器对JavaScript的解析和执行存在差异，可能导致某些脚本在特定浏览器中无法正常运行。

2. 浏览器兼容性问题的解决方法

为了解决浏览器兼容性问题，前端开发者需要采取一些具体的解决方法。以下是一些常见的解决方法：

2.1. 使用CSS Reset

由于不同浏览器的默认样式存在差异，我们可以使用CSS Reset来消除这些差异。CSS Reset是一种常用的样式重置方法，通过重置各个元素的默认样式，使不同浏览器的初始表现保持一致。

2.2. 使用CSS预处理器

CSS预处理器例如Sass和Less可以简化样式编写过程，并提供一些额外的功能，如变量、嵌套和混合等。使用CSS预处理器可以使样式代码更加简洁和易维护，同时也能解决一些浏览器兼容性问题。

前端开发常见的跨浏览器兼容性问题

在日常的前端开发工作中，经常会遇到跨浏览器兼容性问题。不同的浏览器对

网页的解析和渲染方式存在差异，因此相同的代码在不同的浏览器上可能会呈现出不同的效果或产生错误。了解并解决这些兼容性问题是前端开发中必不可少的技能。在本文中，我将介绍一些前端开发中常见的跨浏览器兼容性问题及其解决方案。

一、CSS兼容性问题

1. 盒模型的差异

不同的浏览器对盒模型的解析方式存在差异，导致相同的元素在不同浏览器上

呈现不同的布局。解决方法是使用CSS的`box-sizing`属性，并统一设置为`border-box`，使得所有浏览器都使用相同的盒模型解析方式。

2. 居中对齐

在某些浏览器中，实现居中对齐的方式会有差异。对于水平居中，可以使用

`text-align: center`将文本居中对齐，对于垂直居中，可以使用`display: flex`和`align-items: center`将元素垂直居中。

3. 清除浮动

清除浮动是一个常见的兼容性问题，不同浏览器对于浮动元素的处理方式不同。为了避免浮动元素对其他元素的影响，可以使用`clear: both`来清除浮动。

二、JavaScript兼容性问题

1. DOM操作

不同浏览器对DOM操作的支持存在差异，导致同样的DOM代码在不同浏览

器中运行可能会产生错误。可以使用库如jQuery，它封装了一致的DOM操作接口，避免了浏览器兼容性问题。

2. 事件处理

在不同浏览器中，事件处理方法的绑定方式存在差异。可以使用事件委托的方

式来绑定事件，将事件绑定到父元素上，再通过事件冒泡来处理子元素的事件。

浏览器兼容性问题总结

浏览器兼容性问题是指不同的浏览器在解析和渲染网页时可能出现的差异和问题。由于不同浏览器厂商对网页标准的理解和实现不同，因此在开发和设计网页时需要考虑不同浏览器可能存在的兼容性问题。下面将对浏览器兼容性问题进行综述。

1. 标准支持差异

不同浏览器对网页标准（如HTML、CSS和JavaScript）的支持程度存在差异。有些浏览器可能支持新的HTML5和CSS3特性，而另一些可能不支持或支持的不完全。这导致在开发网页时需要根据目标浏览器的兼容性情况调整代码，以确保在不同浏览器中都能正确显示。

2. 排版和布局差异

不同浏览器对网页元素的排版和布局有不同的解析方式和默认样式。这可能导致在不同浏览器中显示的页面布局不一致，元素间的间距和大小可能有所差异。为了解决这个问题，开发者需要使用CSS重置样式或使用浏览器特定的样式前缀来确保在不同浏览器中保持一致的布局。

3. JavaScript兼容性

不同浏览器对JavaScript的支持程度也存在差异。一些浏览器

可能支持新的JavaScript特性和API，而另一些浏览器可能仅

支持较旧的版本。这可能导致在使用新特性时出现错误或页面无法正常工作。为了解决这个问题，开发者需要对目标浏览器进行兼容性测试，使用polyfill或其他替代方案来实现跨浏览

器兼容性。

4. 图片和多媒体兼容性

不同浏览器对图片和多媒体格式的支持也存在差异。一些浏览器可能支持新的图片格式（如WebP），而另一些可能不支持。此外，浏览器对视频和音频的编解码支持也可能存在差异。为了确保在不同浏览器中正常显示图片和多媒体内容，开发者需要提供多种格式的备选方案，并使用HTML5的元素来实现在

前端开发中常见的浏览器兼容性问题及解决方法

前端开发中常见的浏览器兼容性问题及解决

方法

在当今互联网发展迅速的时代，前端开发已经成为了一个非常重要的岗位，它

涉及到网站的设计、开发和优化等方面。然而，随着不同浏览器的兴起和技术的发展，浏览器兼容性问题也逐渐成为了前端开发人员需要面对的挑战之一。本文将讨论前端开发中常见的浏览器兼容性问题及解决方法。

一、CSS样式兼容性问题

在编写CSS样式时，不同浏览器对一些CSS属性的解析和渲染可能存在差异，这就导致了页面在不同浏览器上的展示结果不一致的问题。例如，某些浏览器对于浮动（float）属性的处理方式可能不同，导致元素位置错乱。解决这类问题的方法

之一是使用CSS Reset或Normalize.css来重置或规范各个浏览器的默认样式。

二、JavaScript兼容性问题

在编写JavaScript代码时，不同浏览器对于某些JavaScript语法或API的支持

程度可能存在差异。这就会导致页面在不同浏览器上的功能出现异常或无法正常使用的问题。为了解决这类问题，可以使用一些缓解方案，例如使用Polyfill库来填

充不同浏览器之间的差异，或者使用JavaScript框架或库，如jQuery或React，这

些框架和库已经经过了大量的测试和优化，能够在不同浏览器上正常运行。

三、响应式设计和移动设备兼容性问题

如今，移动设备的普及程度越来越高，因此，前端开发人员需要考虑页面在不

同屏幕尺寸上的展示效果。响应式设计成为了一种解决方案，可以通过CSS媒体

查询和弹性布局等技术实现。然而，还是有一些移动设备浏览器对于响应式布局的支持并不完善，这就需要开发人员进行一些兼容性处理。例如，可以使用Flexbox

浏览器兼容性问题总结

引言

在开发网站或应用程序时，我们经常会面临不同浏览器之间的兼容性问题。由于不同浏览器厂商在解析HTML、CSS和JavaScript的方式上存在差异，网页在不同浏览器上可能会显示不同。兼容性问题可能导致页面布局错乱、功能无法正常运行，给用户带来不好的体验。

本文将讨论一些常见的浏览器兼容性问题，并提供相应的解决方案。

1. 盒模型差异

不同浏览器在解释盒模型上存在差异，这可能导致元素的尺寸计算不一致。有两种盒模型：W3C 盒模型和 IE 盒模型。

W3C 盒模型：width 和 height 属性表示内容区域（不包括边框和内边距）的宽度和高度。 IE 盒模型：width 和 height 属性表示内容区域 + 内边距 + 边框的总宽度和高度。

解决方案：使用 CSS 盒模型属性box-sizing: border-box;，确保在不同浏览器上的一致性。

.example {

box-sizing: border-box;

}

2. 浮动布局问题

在使用浮动布局时，可能会遇到一些问题，特别是对于容器的尺寸计算和清除浮动。

浮动元素会脱离正常文档流，可能导致父元素的高度塌陷，影响后续元素的布局。

解决方案：可以通过在容器末尾添加一个空的清除浮动元素，或者使用 CSS 清除浮动的技巧。

```css .clearfix::after { content:

浏览器兼容性面试题

浏览器兼容性一直是前端开发中的一个重要问题。在设计和构建网

站时，我们必须考虑到不同浏览器之间的差异，以确保网站在各种浏

览器中都能正常运行。而面试中常会涉及到浏览器兼容性方面的问题，下面是一些常见的浏览器兼容性面试题：

1. 什么是浏览器兼容性问题？

浏览器兼容性问题指的是不同的浏览器在渲染网页时会出现显示、

布局或功能等方面的不一致性。这些问题可能是由于浏览器引擎的差异，CSS或JavaScript的实现差异，或者对特定标准的支持程度不同导

致的。

2. 现代浏览器的兼容性问题主要有哪些方面？

主要的浏览器兼容性问题包括：CSS兼容性，JavaScript兼容性，HTML5和CSS3新特性的支持，响应式布局在不同设备上的兼容性，

以及特定浏览器的bug等。

3. 如何解决浏览器兼容性问题？

解决浏览器兼容性问题可以采取以下几种方法：

- 使用CSS重置或规范化库来规避浏览器默认样式的差异；

- 使用CSS前缀来适应不同浏览器的私有属性；

- 使用JavaScript库，如jQuery等，来封装兼容性代码；

- 根据特定浏览器或版本写特定的CSS或JavaScript代码；

- 使用polyfill或shim来实现不支持新标准的浏览器的特性；

- 进行测试和调试，发现并修复兼容性问题。

4. 你对IE浏览器的兼容性有什么了解？

IE浏览器（特别是低版本）一直以来都是兼容性问题的主要来源。一些常见的IE兼容性问题包括：盒模型的差异、浮动元素引起的布局问题、select标签的样式问题、缺乏对标准API的支持等。为了解决这些问题，可以使用条件注释、特定的CSS或JavaScript代码，以及针对IE的hack技术。

浏览器兼容性大全

浏览器兼容性

浏览器的内核

Mozilla Firefox ( Gecko )

Internet Explorer ( Trident )

Opera ( Presto )

Safari ( WebKit )

Google Chrome ( WebKit )

腾讯TT、世界之窗、360浏览器、遨游浏览器都是给IE加了个外壳，不过如果电脑上装的是ie8的话，这些浏览器还是调用ie7的内核。搜狗浏览器比较特殊，它有两种浏览模式：一是兼容模式，该模式使用IE内核；二是高速模式，该模式使用WebKit内核。解决ie7、ie8兼容性最好的办法是在head标签中加入meta 类型<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />，只要IE8一读到这个标签,它就会自动启动IE7兼容模式

CSS Hack

解决浏览器兼容性问题的主要方法是CSS hack。由于不同的浏览器，比如Internet Explorer 6,Internet Explorer 7,Mozilla Firefox等，对CSS的解析认识不一样，因此会导致生成的页面效果不一样，得不到我们所需要的页面效果。这个时候我们就需要针对不同的浏览器去写不同的CSS，让它能够同时兼容不同的浏览器，能在不同的浏览器中也能得到我们想要的页面效果。这个针对不同的浏览器写不同的CSS code的过程，就叫CSS hack,也叫写CSS hack。

CSS Hack的原理是什么

由于不同的浏览器对CSS的支持及解析结果不一样，还由于CSS中的优先级的关系。我们就可以根据这个来针对不同的浏览器来写不同的CSS。比如 IE6能识别

浏览器兼容性问题总结

浏览器兼容性题是令我等搞前端人很头疼的题，虽然目前的浏览器对eb标准支持的较好，但是还是有不少的人固守着XP,当然XP上自带的浏览器会令人疯掉。以前看书摘录的一些兼容性题，今天想起来给找了出来，还是放在博客里不停补充吧，免得哪天找不到这个件。

WindosXP自带浏览器为E6

不同的操作系统具有不同的结束符号，基于UNX的系统使用“\n”作为行结束字符，基于Windos的系统使用“\n\r”作为行结束字符，基于inos的系统使用“\r”作为行结束字符。当需要写入一个本件并想插入一个新行时，需要使用相应操作系统的行结束符号。

在UNX系统中必须使用正斜线“”作为路径分隔符，而在Windos系统中默认使用反斜线“\”作为路径分隔符，在程序中表示时还要将“\”转义，但也接受正斜线“”作为分隔符的写法。为了程序可以有很好的移植性，建议都使用“”作为件的默认路径分隔符。另外，也可以使用PHP的内置常量DRECTRY_SEPARATR，其值为当前操作系统的默认件路径分隔符。

时至今日，仍然会提到DWE

DWE（音id-inmmy），即Doesn’WorknirosonerneExlorer(它在微软的E中无效)。针对

E（及其他较早浏览器）的缺点，存在一种叫做k的解决方案。所谓k，就是指以非标准的方式来使用CSS，以达到欺骗特定的浏览器，使其“看到”或忽略某些样式的目的。创建k 既乏味又耗时，但只要E6普遍存在，k的创建就要持续下去。

E6不支持子选择符（E7能够支持）

浏览器可能会跳过某些over伪类不按照下列顺序声明的规则：链接(link)、已(visied)、悬停(over)、激活(ive)。助记方法：“LoVe-HA”即lovee（爱恨）

最全整理浏览器兼容性问题与解决方案

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

所谓的浏览器兼容性问题,是指因为不同的浏览器对同一段代码有不同的解析,造成页面显示效果不统一的情况。在大多数情况下,我们的需求是，无论用户用什么浏览器来查看我们的网站或者登陆我们的系统，都应该是统一的显示效果。所以浏览器的兼容性问题是前端开发人员经常会碰到和必须要解决的问题.

在学习浏览器兼容性之前，我想把前端开发人员划分为两类：

第二类是基本按照设计图来开发的前端开发人员，很多细枝末节差距很大，不如间距，行高，图片位置等等经常会差几px。某种效果的实现也是反复调试得到，具体为什么出现这种效果还模模糊糊，整体布局十分脆弱。稍有改动就乱七八糟.代码为什么这么写还不知所以然。这类开发人员往往经常为兼容性问题所困.修改好了这个浏览器又乱了另一个浏览器。改来改去也毫无头绪。其实他们碰到的兼容性问题大部分不应该归咎于浏览器，而是他们的技术本身了。

文章主要针对的是第一类,严谨型的开发人员，因此这里主要从浏览器解析差异的角度来分析兼容性问题.

浏览器兼容问题一：不同浏览器的标签默认的外补丁和内补丁不同

问题症状:随便写几个标签,不加样式控制的情况下，各自的margin 和padding 差异较大。

碰到频率：100%

解决方案：CSS里＊