如何解决如何在非CSS3浏览器上打圆角?
| 我知道在这种情况下我必须使用图像,每个角落使用一个。 例如,如果我需要在给定元素周围的蓝色实心4px边框和8px边框半径, 我据此设计了四张图片, top-left-corner.png top-right-corner.png bottom-left-corner.png bottom-right-corner.png 如果可能的话,不用表格怎么办?解决方法
我不会使用其他人在这里建议的css解决方法/技巧,而是继续使用图像。是的,设置起来比较麻烦,但是它跨浏览器且功能强大。我尝试了许多这些CSS解决方法,并发现它们充其量是无法预测的。在某些IE安装中,它们可能工作正常,但在其他IE安装中却无法(例如,完全导致浏览器崩溃)。更糟糕的是,我们无法确定为什么它在某些安装上可以正常运行,而在其他安装上却无法运行(这适用于相同的IE版本)。
我要么:在IE上没有弯角,要么使用图像。您可以使用嵌套的div:
<div class=\"top-left\">
<div class=\"top-right\">
<div class=\"bottom-left\">
<div class=\"bottom-right\">
... content ...
</div>
</div>
<div>
</div>
然后在css中为每个类设置适当的background-image
,如下所示:
div.top-left { background: url(\'/top-left-corner.png\') left top no-repeat; }
并同时为div之一设置边框样式,例如:
border: 4px solid #f00;
, 您尝试过http://css3pie.com/about/吗?在这种情况下,您不必使用图片...
, Google上有很多与此相关的链接,只需键入圆角CSS即可,您应该找到一些帮助。较旧的技术涉及在要舍入的框的上方和下方使用一组b标签之类的东西,并设置边距以产生所需的半径,但是涉及到一点点,并且有更好的抗锯齿解决方案。
, 如果允许使用表格和一些代码,则可以不使用图像而轻松地切换颜色:
http://spruce.flint.umich.edu/~jalarie/jaa_kcm.htm
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。