虛線邊框邊框圓角

我有圓角的底部，以創建表：虛線邊框邊框圓角

border-bottom-left-radius:pixel;

和同爲右底。

當我添加：

bottom-border-dotted; 
border-bottom-color:white;

點綴白色邊框正確顯示（四捨五入），但表底將恢復到一個矩形。我在這張表中有一個堅實的背景色。當我更換」 bottom-border-dotted，與border-bottom-solid，用相同的白色一切都好

我只是喜歡虛線邊框，尤其是在聖誕節

來源

2013-12-19 user3120211

歡迎SO！你可以格式化你的代碼嗎？對於這個問題，[jsfiddle]（http://jsfiddle.net/）中的示例或類似的示例會很有幫助。 –

您可能還想添加一些更一般的標籤 - 在這裏#css將是一個合適的標籤。 –

我認爲你必須在CSS鐵的一些錯誤：。bottom-border-dotted;是不是有效的CSS，你應該使用border-bottom: 3px dotted black;或border-bottom-style: dotted;。

試試這個例子（見JSFiddle）

HTML

<div></div>

CSS

div { 
    display: inline-block; 
    width: 300px; 
    height: 300px; 
    border-bottom-left-radius: 10px; 
    border-bottom-right-radius: 10px; 
    border: solid 3px black; 
    background-color: #cccccc; 
    border-bottom: 3px dotted black; 
}

結果

上面的代碼將創建這樣的事情：

enter image description here

來源

2013-12-19 19:01:18

虛線邊框邊框圓角

回答

相關問題