在開發(fā)中,有時候我們需要設(shè)置某個元素的上下邊框,而左右邊框卻并不需要,這時候可以使用 CSS 的 border 屬性來實(shí)現(xiàn)。
border-top: 1px solid #000; /* 設(shè)置上邊框:1 像素,實(shí)線,黑色 */ border-bottom: 1px solid #000; /* 設(shè)置下邊框:1 像素,實(shí)線,黑色 */
以上代碼可以設(shè)置某個元素的上下邊框精確到像素,并可以設(shè)置邊框的樣式和顏色。
另外,還可以用縮寫方式來設(shè)置上下邊框,如下所示:
border-width: 1px 0; /* 上下邊框?qū)挾龋? 像素,左右邊框?qū)挾龋? */ border-style: solid; /* 邊框樣式:實(shí)線 */ border-color: #000; /* 邊框顏色:黑色 */
以上代碼可以將上下邊框的寬度設(shè)置為 1 像素,而左右邊框的寬度則為 0,這樣就可以只設(shè)置上下邊框了。
總結(jié)來說,設(shè)置 CSS 的 border 屬性就可以實(shí)現(xiàn)只設(shè)置上下邊框的效果,在實(shí)際開發(fā)中也很實(shí)用。