邊框頂部和邊框半徑CSS3問題

我正在尋找添加邊框頂部，20px solid red;，我希望這個底部被四捨五入。隨着下面它似乎爲我工作。邊框頂部和邊框半徑CSS3問題

-moz-border-radius-bottomright: 12px 12px; 
    border-bottom-right-radius: 12px 12px; 
    -moz-border-radius-bottomleft: 12px 12px; 
    border-bottom-left-radius: 12px 12px;

我該怎麼辦？

來源

2013-04-23 mariovass

你的盒子有背景嗎？ – BoltClock 2013-04-24 00:30:55

我不確定你爲什麼不能產生結果，但上面的代碼看起來是正確的。我提供了一個JS小提琴的例子，和我的作品。我假設你在框中添加了border-top屬性。我認爲你不需要每個邊界財產的兩個價值。希望這可以幫助。

創建一個ID爲框的新圖層對象並應用以下CSS。如果您在框中添加一個段落，邊框將不會出現。

http://jsfiddle.net/brownlace/kEvrE/1/embedded/result/

/* css3 rounded corners */ 

#box { 
border-top: 20px solid red; 
border-bottom-right-radius: 20px; 
border-bottom-left-radius: 20px; 
-moz-border-radius-bottomright: 20px; 
-moz-border-radius-bottomleft: 20px; 
}

來源

2013-04-23 22:57:27 Brownlace

我建議你使用border而不是border-top以確保屬性應用於所有邊框。

border: 20px solid red;

在這種情況下，你可以使用border-bottom-left-radius: 12px;一個值，因爲兩者是相同的。你

還可以添加供應商屬性的WebKit：

-webkit-border-bottom-right-radius: 12px; 
-webkit-border-bottom-left-radius: 12px;

Here是小提琴。

來源

2013-04-24 00:02:03 cortex

邊框頂部和邊框半徑CSS3問題

回答

相關問題