圆角IE和背景图像 [英] rounded corners IE and background images

问题描述

我在我的页面中有一个项目：

I have an item in my page thus:

<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）
i已经做了一些搜索，发现DD_roundies解决方案..
http://www.filamentgroup.com/lab/achieving_rounded_corners_in_internet_explorer_for_jquery_ui_with_dd_roundi/
但遗憾的是，这只是删除了背景，从而渲染列表和标题文本与透明背景 - 工作正常时不透明度或bg图像不使用，但这不适合我的问题显然...
有人知道一个解决方案吗？
i当然可以丢弃bg图像，但这似乎是获得透明度跨浏览器工作的最可靠的方法。

of course this works a treat in FF and safari (and opera).. but IE doesnt do anything (how i hate IE) i have done a bit of searching around and found the DD_roundies solution.. http://www.filamentgroup.com/lab/achieving_rounded_corners_in_internet_explorer_for_jquery_ui_with_dd_roundi/ but sadly this just drops the backgrounds and thus renders the list and heading text with a transparent background - works fine when opacity or bg images are not used, but that doesnt suit my problem obviously... does anyone know of a solution to this? i could of course ditch the bg image, but this seemed to be the most reliable way to get the opacity working across browsers..

感谢

nat

推荐答案

实际上不是一个答案。

not actually an answer.. dont shoot me but needed more chars than the comments would allow

。

背景是alpha'd png的
这是一个耻辱，因为这似乎只是我需要的..
尝试

again though this does not seem to work with the backgrounds being alpha'd png's which is a shame as that appeared to be just what i needed.. tried

.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背景图片作为放在opcatiy或任何在div，然后alphas的内容太..不想要..

I am using an alpha'd background image as putting opcatiy or whatever on the div, then alphas the content too.. dont want that..

任何其他建议？
，除非有人能解释一个方法来获得背景很好的alpha'd，而不影响包含的文本/内容的字母。

any other suggestions? unless someone can explain a way to get the background nicely alpha'd without affecting the alphaness of the contained text/content.

所有的资金M $有为什么不能让他们得到圆角工作像anyoe其他有..
tossers - 总是花费这么多时间让事情在IE中工作，在其他地方工作正常。

with all the funding that M$ have why cant they get rounded corners working like everyoe else has.. eh? tossers - always spend so much time getting things to work in IE that work fine everywhere else..

这篇关于圆角IE和背景图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！