怎么解决css3圆角兼容IE6问题

html-css016

怎么解决css3圆角兼容IE6问题,第1张

IE浏览器都出到IE11了,没想到还有人用IE6。现在人都是考虑IE9兼容问题。

<html>

<head>

<style>

ul{

width:100%

border:3px solid #888

-webkit-border-radius:30px/*表示以-webkit-核的浏览器*/

-o-border-radius:30px/*-o-表示以-o-核的浏览器*/

border-radius:30px/*没有前缀表示默认浏览器*/

border-radius:30px

padding:3px

color:#ff88dd

text-align:center

}

</style>

<body>

<ul>圆角</ul>

</body>

</html>

IE6出现这种问题是因为IE6里有个默认的12px的值在里面,而这个值就是字体的值,所以楼主你在.sleft_top和.sleft_bottom里面都加上font-size:0就可以了,同时你写的那个背景图片写得不规范,中间的那个.sleft_middle应该要给一个repeat-y的值而不是怎么都不写,如果说这个宽度超出你你原来背景图片的宽度的话那它也什么向x轴填满就如图

.sleft_top和.sleft_bottom的背景图定义位置上的 center(第二个)其实不用定义,因为你的高度和背景图片的高度是一致的!