Question

我的页面中有一个项目：

<div class="rounded">
<h2>Heading Text</h2>
<ul>
    <li><a href="/default.aspx">Summary link</a></li>
    <li><a href="/default.aspx">Summary link</a></li>
    <li><a href="/default.aspx">Summary link</a></li>
</ul>
<p>or... some text or whatever</p>
</div>

与此块关联的样式为：

.rounded{
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
background:url("10x10.50percentalpha_white.png") repeat scroll left top transparent;
height:270px;
overflow:hidden;
padding:0 0 5px;
}

.rounded h2{
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
-webkit-border-top-right-radius:5px;
-webkit-border-top-left-radius:5px;
border-top-right-radius:5px;
border-top-left-radius:5px;
background:url("wide_rl_fade.png") repeat-y scroll right top transparent;
color:#C4161C;
font-size:130%;
padding:10px 20px;
text-align:left;
text-transform:uppercase;
}

当然这适用于FF和safari（和歌剧）......但IE不做任何事情（我多么讨厌IE）我做了一些搜索，找到了DD_roundies解决方案.. http://www.filamentgroup.com/lab/achieving_rounded_corners_in_internet_explorer_for_jquery_ui_with_dd_roundi/ 但遗憾的是，这只是删除了背景，因此呈现透明背景的列表和标题文本 - 当不使用不透明度或bg图像时工作正常，但这显然不适合我的问题... 有谁知道解决这个问题？我当然可以抛弃bg图像，但这似乎是让不透明度在浏览器中运行的最可靠方式..

感谢

NAT

Answer 1

用于圆角的样式只能由Firefox和Webkit浏览器识别。您真正拥有的唯一其他解决方案是使用背景图像。有一个我使用的jQuery插件非常好但是再次，对于Internet Explorer它只是将图像放在角落以实现圆润的幻觉。这是：http://jquery.malsup.com/corner/

编辑：CSS3将有一个实现此目标的标签，但任何当前的IE版本仍然不支持它：http://www.w3.org/TR/css3-background/#the-border-radius

Answer 2

查找http://css3pie.com/它使用附加行为为IE提供一些css3功能。

Answer 3

实际上并不是一个答案..不要拍我但需要比评论允许更多的字符

感谢回复..

再次虽然这似乎不适用于alpha'd png的背景这真是一种耻辱，因为它似乎正是我所需要的...... 试图

.rounded{
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
background:url("10x10.50percentalpha_white.png") repeat scroll left top transparent;
height:270px;
overflow:hidden;
padding:0 0 5px;
behaviour: url(path/to/PIE.htc)
}

我正在使用alpha'd背景图片作为在div上放置opcatiy或其他任何东西，然后alphas内容也是..不要那样..

还有其他建议吗？除非有人能够解释一种方法，以便在不影响所包含文本/内容的alpha性的情况下很好地获得背景。

凭借M $所拥有的所有资金，他们为什么不能像其他人一样工作圆角......呃？ tossers - 总是花很多时间在IE中工作，在其他任何地方工作都很好..

圆角IE和背景图像

3 个答案: