當(dāng)我們需要給某個(gè)元素添加邊框時(shí)，一般都會(huì)使用CSS中的border屬性。該屬性可以同時(shí)設(shè)置邊框的寬度、樣式和顏色。

然而，在某些情況下，我們只希望邊框顏色是兩條，而不是四條。比如，當(dāng)我們需要實(shí)現(xiàn)類似下方這種效果：

___________________
|                   |
|                   |
|                   |
|    我是內(nèi)容區(qū)     |
|                   |
|                   |
|                   |
|___________________

這種情況下，我們可以使用CSS中的linear-gradient()函數(shù)來達(dá)到目的。

div {
background: linear-gradient(#000, #000) top left,
linear-gradient(#000, #000) top right,
linear-gradient(#000, #000) bottom left,
linear-gradient(#000, #000) bottom right;
background-size: 1px 50%, 1px 50%, 1px 50%, 1px 50%;
background-repeat: no-repeat;
}

上面的代碼中，我們先給div元素設(shè)置了四個(gè)不同的線性漸變背景色，每個(gè)漸變都是從黑色到黑色，也就是實(shí)線。然后，我們將每個(gè)漸變的位置分別設(shè)置成左上角、右上角、左下角和右下角。接著，我們通過background-size屬性將每個(gè)漸變的寬度設(shè)置成1像素，高度為50%。最后，我們通過background-repeat屬性將這些漸變色固定在自己的位置上，不進(jìn)行重復(fù)。

通過這種方式，我們就成功地實(shí)現(xiàn)了只使用兩條邊框的效果，同時(shí)還可以自由控制邊框的顏色、寬度、樣式。