1、CSS邊框虛線 - TOP
這里通過(guò)邊框?qū)傩缘奶摼€邊框border控制虛線。以下設(shè)置的css 高度(css height)和css 寬度（css width）為350像素是為了便于觀看演示 其它意思。
一、四邊為虛線邊框


Html代碼：

這里設(shè)置邊框縮寫(xiě)方式定義divcss5選擇器四邊邊框?yàn)?px的黑色虛線邊框

二、左邊為虛線：
CSS代碼：

Html代碼：

這里設(shè)置了左邊一邊為黑色虛線邊框

三、右邊為虛線：
CSS代碼：

Html代碼：

這里設(shè)置了右邊一邊為黑色虛線邊框

四、頂部邊（上邊）為虛線：
CSS代碼：

Html代碼：

這里設(shè)置了頂邊（上邊線）一邊為黑色虛線邊框

五、底部邊（下邊）為虛線：
CSS代碼：

Html代碼：

這里設(shè)置了底邊（下邊線）一邊為黑色虛線邊框

六、任意一邊不為虛線，其它三邊為虛線情況
加入右邊邊框不為虛線而沒(méi)有邊線，其它三邊為黑色虛線邊框
CSS代碼：

Html代碼：



2、超鏈接虛線下劃線 - TOP
我們常常會(huì)設(shè)置被鏈接的文字內(nèi)容要么帶鏈接有虛線的下劃線，或鼠標(biāo)移動(dòng)到有鏈接的文字上出現(xiàn)虛線下劃線，這個(gè)怎么實(shí)現(xiàn)的呢，這里為大家介紹關(guān)于CSS超鏈接的虛線下劃線。

一、帶鏈接文字有虛線下劃線
這里也是通過(guò)CSS border邊框?qū)傩詠?lái)控制超鏈接a對(duì)象的CSS樣式。

演示CSS代碼：





完整DIV CSS代碼：







說(shuō)明：text-decoration:none;這個(gè)是去掉CSS 下劃線（超鏈接默認(rèn)自帶的下劃線屬性）



以上為有CSS超鏈接的文字帶虛線下劃線。

二、鼠標(biāo)放到帶鏈接文字上時(shí)出現(xiàn)虛線下劃線
這個(gè)和上面的很相似，只需對(duì)超鏈接 A去掉下劃線，對(duì)鼠標(biāo)經(jīng)過(guò)時(shí)CSS文字下方帶虛線邊框下劃線即可。
對(duì)應(yīng)CSS代碼：


[/code]a:hover{border-bottom:1px dashed #111;} [/code]
這樣就實(shí)現(xiàn)，大家不妨試試超鏈接下劃線實(shí)例。

3、列表型CSS虛線下劃線 - TOP
常常他們碰到CSS LI的時(shí)候希望此CSS 列表樣式每排內(nèi)容下方為虛線分割開(kāi)如下圖

這里我們只需對(duì)LI設(shè)置底部邊框?yàn)樘摼€邊框即可。
首先我們是在對(duì)CSS初始化情況下設(shè)置CSS代碼：

即可實(shí)現(xiàn)li的列表型內(nèi)容如上圖虛線隔開(kāi)效果（每個(gè)li內(nèi)容底部為虛線邊框）
還有我們常常碰見(jiàn)li的底部虛線很小就如一個(gè)點(diǎn)那么小，而border就很難實(shí)現(xiàn)了，這個(gè)時(shí)候我們需要一張?zhí)摼€的點(diǎn)圖片即可(一邊高1像素寬3像素的1像素顏色圖片即可實(shí)現(xiàn))
對(duì)應(yīng)CSS li代碼：


這里不再詳細(xì)演示我們?cè)赩IP也為大家詳細(xì)介紹和演示制作各種li的CSS知識(shí)點(diǎn)。

4、CSS定義一條水平虛線 - TOP
這個(gè)很好理解同樣可以使用對(duì)div對(duì)象設(shè)置邊框虛線即可實(shí)現(xiàn)同時(shí)也可以對(duì)hr水平線標(biāo)簽設(shè)置虛線屬性即可實(shí)現(xiàn)水平虛線分割線。

這里帶過(guò)即可如下：
對(duì)div設(shè)置水平虛線線：


對(duì)應(yīng)HTML代碼：



對(duì)hr水平分割線設(shè)置屬性：
第一種，hr標(biāo)簽內(nèi)設(shè)置虛線屬性：



這里說(shuō)明的是size為hr的值，一邊設(shè)置為1即可。

第二種在css代碼或CSS文件中定義hr的css屬性


對(duì)應(yīng)html內(nèi)hr標(biāo)題代碼：


這里是對(duì)hr設(shè)置邊框?yàn)轫敳炕虻撞可舷逻吶我庖粭l邊為1像素的藍(lán)色虛線邊框，同時(shí)設(shè)置hr的size為1，和第一種值大致相同，唯一區(qū)別在于當(dāng)在html中出現(xiàn)了hr標(biāo)簽，hr標(biāo)簽屬性就為css設(shè)置，如果網(wǎng)頁(yè)多次出現(xiàn)可以減少代碼量。

以上所有的CSS虛線涉及了css borer、CSS 下劃線、CSS 背景等知識(shí)，希望大家能掌握各種方法設(shè)置DIV虛線、虛線邊框、DIV CSS虛線下劃線的方法。