关于浏览器的兼容性问题

关于IE浏览器的兼容性问题,老师在上课有带我们了解过,课后我也在整理和理解了这个问题

一 不同浏览器的标签默认标签的会有产生间距

比如以下

  

为了消除这个边距 使在不同浏览器有一样的效果

解决方法就是在每个CSS开头都加上  *{margin:0;padding:0;} 这样来设置各个标签的内外补丁是0。

二  对于IE6.7对display:inline-block不支持

对于一般浏览器css样式中使用display:inline-block就会正常显示

我们先写html

<ul>
<li>首页</li>
<li>解决方案</li>
<li>加入我们</li>
</ul>

再是css样式

ul li {
display: inline-block;
}

最后在IE默认的模式正常显示

但是  我们把默认模式换成IE6, IE7 显示的完全不同

解决方法就是在css样式中加上*display:inline 这样就能正常的显示了

三 图片默认有间距

先设置HTML和css

一般浏览器显示出来的都是这样

明明宽度足够但是还是不在同一线上

解决方案是要在css图片的样式上加上float  这样就会消除图片间距

这是简单的解决常见浏览器的兼容问题,还有更多的需要自己慢慢去试去了解

时间: 2024-10-22 08:37:48

关于浏览器的兼容性问题的相关文章

浅谈浏览器的兼容性

浏览器的兼容性浅谈 Css兼容性 <span>标签在IE下要放在前面,否则IE会有问题. IE6下没有min-width的概念,起默认的width就是min-width IE6下两个float之间会有3px的bug IE6图片的下方会有空隙 IE6下margin:0 auto不能剧中,解决:为其父容器设置text-align:center A标签的伪类一定要按LV H A的顺序写,否则ie6有错误 Javascript的兼容性 绑定事件不一样.标准的绑定事件为addEventListener,

谈谈浏览器的兼容性

(一)html部分 1. H5新标签在IE9以下的浏览器识别 <!--[if lt IE 9]> <script type="text/javascript" src="js/html5shiv.js"></script> <![endif]--> html5shiv.js下载地址: https://github.com/aFarkas/html5shiv/releases 2. ul标签内外边距问题ul标签在IE6\

浏览器样式兼容性问题及解决方式(一)

工作中常常会碰到浏览器样式兼容性的问题.从今天開始,收集和整理一些常见的兼容性问题,系统的学习下前端知识.欢迎大家指正交流. 1.浏览器默认的标签内外边距不同,用通配符*统一设置为0 *{margin:0px; height:0px;} 2.标签最低高度min-height不兼容 {min-height:200px; height:auto !Important; height:200px; overflow:visible;} 3.设置较小高度标签 当给指定标签设置较小高度时,就碰到与浏览器默

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{ float:lef

DOM事件总结(事件处理程序的类型及浏览器的兼容性)

事件处理: 1.HTML事件处理程序 例子: <input type="button" id="btn" value="click me" onclick="alert('Hello!');"> 或者: <input type="button" id="btn" value="click me" onclick="show()"&

MyEclipse使用教程:Linux Internal Web浏览器的兼容性

MyEclipse特性与Linux内部web浏览器的兼容性问题 Eclipse 3.3现在支持所有平台上的Mozilla浏览器(对Mozilla的迟滞无处不在),对于无处不在的Mozilla更多信息:详见bug#7923.对于MyEclipse的Linux用户来说,这就意味着附带的MyEclipse 6.0嵌入的Mozilla浏览器核心可以作为Eclipse平台的核心浏览器,随着附带的MyEclipse 6.0嵌入的Mozilla浏览器核心需要MyEclipse的特性如下: 需要嵌入MyEcli

IE和Firefox浏览器CSS兼容性技巧整理

转自:http://homepage.yesky.com/185/11484185all.shtml#p11484185 CSS兼容常用技巧(1) 更多精彩相关文章推荐: 各大浏览器 CSS3 和 HTML5 兼容速查表 IE6/IE7/IE8三个版本的CSS兼容速查手册 CSS hack定义技巧浏览器兼容一览表 XHTML+CSS兼容性解决方案 CSS样式表对浏览器的兼容性问题有时让人很头疼,不过当我们了解了其中的原理与技巧,就会觉得轻松一些.本文收集整理了IE7,6与Fireofx的兼CSS

浏览器样式兼容性问题及解决方案(一)

工作中经常会碰到浏览器样式兼容性的问题,从今天开始,收集和整理一些常见的兼容性问题,系统的学习下前端知识,欢迎大家指正交流. 1.浏览器默认的标签内外边距不同,用通配符*统一设置为0 *{margin:0px; height:0px;} 2.标签最低高度min-height不兼容 {min-height:200px; height:auto !Important; height:200px; overflow:visible;} 3.设置较小高度标签 当给指定标签设置较小高度时,就碰到与浏览器默

CSS对浏览器的兼容性(IE和Firefox)技巧整理

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