注册 登录  
 加关注
查看详情
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

一车,一房,一个温暖家

10万左右的车,80平方的房子,这是我奋斗的暖暖的家

 
 
 

日志

 
 

引用 兼容问题总结   

2015-06-01 18:42:45|  分类: 默认分类 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
本文转载自小y《 兼容问题总结》

常见问题一:随便写几个标签,不加样式控制的情况下,各自的margin 和padding差异较大。这个是最常见的也是最易解决的一个浏览器兼容性问题

解决方案:

几乎所有的css文件开头都会把网页中所用到的标签通过群组来设置网页中所用到的各个标签的内外补丁是0。

常见问题二: BUG产生情况:1.IE6.0下;2.块属性;3.float;4.有横向marigin

解决方案:

针对这个BUG我们通常采用加一个display:inline;使产生BUG的四条件不能同时具备,来解决这个问题。

常见问题三:IE6.0下默认有行高。

解决方案:

这个BUG主要是由于IE6.0下会有默认行高产生的,这时我们通常会加一条属性来解决。oveflow:hidden;

在这里扩展一下overflow:hidden;具有清除内部浮动的作用。

常见问题四:ul li和ol li,中的li如果在不浮动的情况下,父级没有设高度,在IE6.0和IE7.0中会出现多出几像素的问题。

IE6.0IE7.0下面除了第一个li ,其他有spanli下面都有几像素的间距,这就是libug:前提是设置了宽高的li,然后li里面的标签,不论块属性还是行内属性,只要设置浮动了,就会出现这样的bug,所以这个bug=li设宽高+li内标签float

解决方案

1.li不设置宽和高;

2.li里面的标签不能有浮动;

常见问题五: 在各个浏览器下img有空隙产生

解决方法:

所有浏览器下都会出现这种情况:原因是间隙是浏览器解析图片之间空格所产生的。解决的办法很简单,就是让图片浮动,就能解决。

常见问题六: a标签套img时,在不同浏览器会出现不同颜色边框。

这是a标签下的图片所带来的问题,关键在于a多了一个border。

解决方案

在实际应用中我们往往只想对图片加超链接而不想要边框线,我们通常会对a下的img加上border:onne;这一属性来解决上述问题。

常见问题七:一个父级标签与几个子级标签嵌套,子标签float父标签不浮动。

当父标签不浮动子标签浮动,子标签就会浮起来,而父标签是靠子标签撑开高度,

在IE6.0下对标签的之称不是很完善,所以就长生了上述问题。

解决方案:

1.在子标签后部进行清除浮动。

2.对父级标签加一个oveflow:hidden;具有清除内部浮动效果。

常见问题八:

html代码:

     <p href="#">float right</a></p>

CSS样式:

body,p,a{

margin:0px;

padding:0px;

}

.fa{

border:1px red solid;

width:200px;

height:200px;

}

.fa a{float:right;}

解决方案:

html代码:

     <p href="#">float right</a></p>

CSS样式:

body,p,a,span{

margin:0px;

padding:0px;

}

.fa{

border:1px red solid;

width:200px;

height:200px;

}

.fa a{float:right;}

.fa span{float:right;}

  评论这张
 
阅读(1)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2018