在網(wǎng)頁設(shè)計(jì)中,美觀與實(shí)用是必不可少的。然而,有時(shí)候我們會發(fā)現(xiàn)網(wǎng)頁中的元素之間有著一些奇怪的空隙,并且這些空隙似乎很難去掉。造成這些空隙的一個(gè)常見原因是CSS的邊框(border)。
一些元素的默認(rèn)樣式中會自帶邊框,而這些邊框會占據(jù)一定的空間,使得相鄰元素之間出現(xiàn)距離。想要去掉這些間隔必須去掉邊框,而最快捷的方式就是使用CSS的border屬性,將其設(shè)為0。
下面是一些樣本代碼:
p { border: 0; }這段代碼將去掉所有p元素中的邊框。如果只想去掉某個(gè)具體元素中的邊框,可以為該元素指定一個(gè)獨(dú)特的class標(biāo)識,如下所示:
.no-border { border: 0; }之后在需要去掉邊框的元素中使用該class即可。如果想要去掉文本框(input)的邊框,可以使用以下代碼:
input[type="text"], textarea { border: 0; }這段代碼中指定了所有type屬性為"text"的input元素以及文本域textarea的邊框均設(shè)為0。同樣,也可以為其指定一個(gè)獨(dú)特的class。 最后要注意的是,邊框去掉后并不僅僅是看上去沒有了邊框,相鄰元素之間也可以緊密地靠攏在一起,從而使網(wǎng)頁的整體美觀度增加。