邊界半徑不適用於img元素

我想在IE 10中設置邊界半徑不起作用，但在IE 9中工作。問題是當我只爲左上角定義半徑時圖像的邊角，圖像不會在邊界半徑處剪切。邊界半徑不適用於img元素

BAD：

<img style="border-radius: 14px 0px 0px 0px" alt="" src="">

現在，如果我添加第二邊界半徑要麼右上或左下，則左上半徑被應用。

GOOD：

<img style="border-radius: 14px 1px 0px 0px" alt="" src="">

此網址演示了此問題，並增加了不使用IE 10

UPDATE 9/30對於那些參考圖像：聽說回從微軟Connect網站，他們證實他們能夠重現該問題並正在進一步調查。

2012-09-28 Rick

是不是IE10還是測試版？ –

@dystroy：不再;上個月，IE10和Windows 8一起使用了RTM。但是，它尚不適用於Windows 7.我認爲它將在下個月向公衆發佈Windows 8後推出。 – BoltClock

@BoltClock那麼我們可以在我們的PC上安裝IE 10還是需要Windows 8？請提供一些鏈接。（我在辦公室現在。不能安裝任何東西在這裏） –

我剛剛遇到了同樣的問題，在圖像上沒有在IE 10中應用圓角。本來我有這個：

border-radius: 45px 0 45px 0;

一個沒有邊界可言了，結果，改變一個0邊界半徑的讓我邊境半徑再次出現。

最後我應用這個風格：

border-radius: 45px 0.1px 45px 0.1px;

已在其他瀏覽器沒有副作用，但我已經回到圓角在IE 10

2013-05-06 17:07:08 user2355507

非常好。謝謝。 – isherwood

嘗試border-top-left-radius: 14px。

2012-09-28 13:24:59 rajesh

-1

據我所知，大多數瀏覽器不會讓你剪裁具有圓形邊框的圖像。（即使IE10在其他瀏覽器中看起來很怪）。最簡單的解決方法是使用一個div嵌套，並設置圖像作爲背景：

HTML

<div class="imageborder"> 
    <div id="image1"> </div> 
</div>

CSS

.imageborder { 
    border-radius: 5px; 
} 
#image1 { 
    background-image: (yourimage); 
}

您可能需要在div手動設置高度爲它顯示。

2012-09-29 10:35:06 Neograph734

邊界半徑img標籤適用於IE9，Chrome，Safari和Firefox。這看起來像IE 10的迴歸錯誤。 – Rick

回答