[英]rounded corners IE and background images
我的頁面中有一個項目:
<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 / achievement_rounded_corners_in_internet_explorer_for_jquery_ui_with_dd_roundi /但遺憾的是這只會丟棄背景,從而使用透明背景渲染列表和標題文本 - 當不使用不透明度或bg圖像時工作正常,但這顯然不適合我的問題...有誰知道解決這個問題? 我當然可以拋棄bg圖像,但這似乎是讓不透明度在瀏覽器中運行的最可靠方法。
謝謝
NAT
用於圓角的樣式僅由Firefox和Webkit瀏覽器識別。 您真正擁有的唯一其他解決方案是使用背景圖像。 有一個我使用的jQuery插件非常好但是再次,對於Internet Explorer它只是將圖像放在角落以實現圓潤的幻覺。 這是: http : //jquery.malsup.com/corner/
編輯:CSS3將有一個標簽,實現這一點,但任何當前的IE版本仍然不支持: http : //www.w3.org/TR/css3-background/#the-border-radius
查看http://css3pie.com/它使用附加行為為IE提供一些css3功能。
實際上並不是一個答案..不要拍我但需要比評論允許更多的字符
謝謝你的回復..
再次雖然這似乎不適用於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背景圖像作為opcatiy或任何在div上,然后alphas內容也..不要那樣..
還有其他建議嗎? 除非有人能夠解釋一種方法來很好地獲得背景,而不會影響所包含的文本/內容的alpha性。
憑借M $所擁有的所有資金,他們為什么不能像其他人一樣工作圓角......呃? tossers - 總是花很多時間在IE中工作,在其他任何地方工作都很好..
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.