顯示元素的邊框而不使用邊框屬性

我想顯示元素的邊框類型外觀，但不使用邊框屬性。這可能嗎？顯示元素的邊框而不使用邊框屬性

2012-06-14 King Kong

爲什麼你不想使用'border'？ – BoltClock

我同意BoltClock的意見，說出你的意圖總是好的，而不是你認爲的解決方案。 – Fewfre

CSS3有兩個選項可以使用：outline和box-shadow。或者，如果您需要舊的瀏覽器支持，則使用背景div來創建邊框。

2012-06-14 13:44:47 dciso

'outline'對CSS3並不陌生。 – BoltClock

使用outline而不是border。這也有一個額外的優勢; div的高度/寬度不會添加輪廓中的點，它只會與border一樣。

2012-06-14 13:44:17 poepje

其不支持所有IE，只能從IE8 – deerua

我不知道，謝謝。然而，這並不是我會擔心的，因爲IE用戶不到3％（這就是所有瀏覽器使用量的0.2％）使用IE7或更低版本。 – poepje

如果它在他的瀏覽器支持列表中，這是值得擔心的，我們不知道這一點。框的大小爲邊框+寬度： http://paulirish.com/2012/box-sizing-border-box-ftw/ – Luca

另一種選擇是

<div style="background-color: black; padding: 2px"> 
    <div style="background-color: white"> 
     hello!! 
    </div> 
</div>

2012-06-14 13:47:35

你可以使用:before pseudoelement與指定width/height並應用了background-color（當然pseudoelements不appliable自我封閉元素，如img，input， hr，...）

2012-06-14 13:57:09 fcalderan

回答