要在我的容器元素上创建圆角,我使用此CSS:
border-radius:12px; -moz-border-radius: 12px; -webkit-border-radius: 12px;
但是,IE似乎没有识别和解释border-radius属性(至少版本为7-8,显然是版本9的版本).
有没有一种解决方法可以完全用CSS(没有脚本,没有额外的标记)？
对于JavaScript/jQuery解决方案:我会使用基于这些的解决方案,如果我可以包含一个可以读取我的CSS的脚本,解释border-radius属性(包括border-top-left-radius,border-top-right-半径),并相应地应用角.这存在吗？
Kyl*_*yle 13
据我所知IE <9,在纯CSS中无法做到这一点.
据记载,IE9具有边界半径支持.
有可用的Javascript解决方法 ,但正如你所说,你不想实现它们,你有点卡住了.
除非你想使用图像,否则如果你有静态大小元素,这种方法很有效,但如果它们改变大小则不起作用.
除此之外,我没有任何纯粹的CSS解决方案,没有大量的hacky标记.
更新:
我已经链接到一个可以为你做这个的资源,CurvyCorners jQuery将检测DOM元素的使用,-webkit-border-radius并moz-border-radius使用一系列没有图像的小DIV在IE中复制效果.您还可以告诉它将效果应用于特定元素.
更新#2:
在Spudley建议检查CSS3Pi之后,我非常建议这样做,因为它使用behaviour仅适用于IE 的CSS属性,所以它不会与其他浏览器混在一起,这也就是说没有hacky标记添加到您的页面(Curvy Corners添加了许多小div)并且没有使用图像.
希望能帮助到你 :)
你想要一种方法来做到这一点,没有脚本和没有任何额外的标记.这根本不可能.IE7/8中缺少这个功能,让IE进行操作的唯一方法是使用脚本或标记来模拟该功能.
最好的选项是仅影响IE并且对其他浏览器不可见的选项.这意味着CSS3Pie优于所有其他选项,因为它使用的技术仅由IE支持.它还允许您以与其他浏览器相同的方式在CSS中指定边界半径,使其更加一致.
就个人而言,我每次都会选择这个解决方案.到目前为止,它是IE中最干净的解决方案.忘记任何jQuery或纯JavaScript解决方案; 他们几乎都有这种或那种问题,以及涉及角图形的标记选项; 只是不要想一想!
CSS3Pie相对于其他常见解决方案的真正好处是它使用基于矢量图形的解决方案,而不是像CurvyCorners和其他人那样将大量的div粘贴到您的文档中.这意味着CSS3Pie生成的圆角可以平滑地绘制,并且可以在元素本身及其后面的背景图形上正常工作.大多数其他解决方案在这些方面存在严重问题
我不知道为什么你反对使用脚本 - 特别是基于HTC的这样的脚本不会妨碍其他脚本.最糟糕的情况是用户关闭了脚本.在这种情况下,他们得到的只是方角; 这不是世界末日.