当前位置:网络安全 > IE8中border-raduis的兼容性问题

IE8中border-raduis的兼容性问题

  • 发布:2023-10-04 22:58

-->

border-raduis是CSS3新添加的属性。我们使用起来非常方便,效果也非常好。不过,IE8及之前的IE版本不支持该属性。如何解决这个问题呢?

1。切入背景

这也是我经常使用的方法。虽然有点麻烦,但是绝对不是问题。当我遇到圆角时,我会检查UI给我的psd图片,看看是否可以直接剪切圆形或圆角。这样以后就不用再考虑写border-raduis属性了,直接砍掉就可以了。只需将背景图片放在上面即可。这种方法的另一个优点是你不会遇到 PNG 的黑边。但也有一个问题,那就是图片的尺寸必须裁剪得当。 IE8中不支持backgro-size属性,所以不要考虑调整图片的大小。同时,它兼容所有浏览器。我经常使用这种“愚蠢”的方法。

当然,这是避免使用 border-raduis 的方法。如果必须使用 border-raduis 属性怎么办?

2、www.sychzs.cn

这是一个插件。我个人认为它确实很有用,而且我已经使用了一段时间了。您可以找到许多如何在线使用它的版本。总结一下:

写完border-raduis后,添加行为:url(js/www.sychzs.cn); url中的内容其实就是这个文件的引入地址。我测试的时候发现只需要直接引入即可。但在实际情况下,有时却行不通。于是我查了一下别人的经验,发现可能有影响因素:

①定位,即位置属性②z-index,保证该标签的优先级高于周围其他标签③background-color背景色

添加第一个和第二个即可解决问题。至于背景颜色,目前我还没有发现有什么影响。只是使用该属性时最好设置背景色,因为如果不设置,则会默认添加黑色。

还要注意的是,添加此插件后,border-raduis后面的参数不能是百分比。例如50%,系统会默认为50px。

另外,在测试过程中,我发现你不能直接将这个属性添加到图像中。您需要为图像指定一个父级,并将此属性添加到其父级。

同时,此插件还可以让IE8显示box-shadow和text-shadow这两个属性。但需要注意的是,在IE8中设置的颜色只能是黑色。

好的,现在就这些。我不擅长写文章。我基本上想到什么就写什么。如果您还有其他经验,欢迎补充。如果我在以后的工作和学习中发现其他问题,我也会补充。的。

-->

相关文章