CSS 中的實(shí)線和虛線都是用來(lái)設(shè)置邊框樣式的,其中實(shí)線是默認(rèn)的邊框樣式,而虛線則是通過(guò) border-style 屬性來(lái)設(shè)置的。以下是實(shí)線和虛線的設(shè)置代碼及效果演示:
/* 實(shí)線邊框樣式 */ border: 1px solid black;
效果演示:
/* 虛線邊框樣式 */ border: 1px dashed black;
效果演示:
可以看到,實(shí)線邊框的樣式是一條實(shí)線,而虛線邊框的樣式則是一條由小線段組成的虛線。虛線的線段長(zhǎng)度和間隔長(zhǎng)度可以通過(guò) border-width 屬性來(lái)設(shè)置:
/* 5px 長(zhǎng)度未線段,10px 長(zhǎng)度的間隔 */ border-width: 1px; border-style: dashed; border-color: black; border-image: initial; border-image-source: initial; border-image-slice: initial; border-image-width: initial; border-image-outset: initial; border-image-repeat: initial; border-image-source:initial; border-image-slice:13;
效果演示:
通過(guò) border-width 屬性的設(shè)置,可以實(shí)現(xiàn)更加復(fù)雜的虛線邊框樣式,比如雙劃線、點(diǎn)劃線等。對(duì)于一些需要特定邊框樣式的設(shè)計(jì)需求,虛線邊框是一種很好的解決方案。
上一篇dw.css3