單標(biāo)簽純css指的是不需要閉合標(biāo)簽，只需要使用css即可實(shí)現(xiàn)一些效果的標(biāo)簽。這些標(biāo)簽的實(shí)現(xiàn)方式比較巧妙，也比較簡(jiǎn)單，因此可以用來實(shí)現(xiàn)一些特殊效果。

<div class="arrow-up"></div>
.arrow-up {
width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-bottom: 5px solid black;
}

上面的代碼展示了一個(gè)箭頭的樣式，它只需要一個(gè)div標(biāo)簽即可實(shí)現(xiàn)。關(guān)鍵在于利用了邊框的特性，通過設(shè)置左、右邊框?yàn)橥该鳎撞窟吙驗(yàn)閷?shí)線，就可以達(dá)到箭頭的效果。

<div class="circle"></div>
.circle {
width: 50px;
height: 50px;
border-radius: 50%;
background-color: red;
}

接下來展示了一個(gè)圓形的樣式，同樣只需要一個(gè)div標(biāo)簽即可實(shí)現(xiàn)。利用了border-radius屬性實(shí)現(xiàn)圓形，同時(shí)設(shè)置寬高和背景顏色即可。

<div class="triangle-up"></div>
.triangle-up {
width: 0;
height: 0;
border-left: 25px solid transparent;
border-right: 25px solid transparent;
border-bottom: 50px solid red;
}

最后再展示一個(gè)三角形的樣式，同樣也只需要一個(gè)div標(biāo)簽即可實(shí)現(xiàn)。利用了邊框的特性，將左右邊框設(shè)置為透明，底部邊框設(shè)置為實(shí)線，高度為0，就可以實(shí)現(xiàn)一個(gè)平底三角形的效果。

總的來說，單標(biāo)簽純css的技巧雖然不算特別實(shí)用，但是在特殊效果的實(shí)現(xiàn)上還是蠻有趣的一個(gè)探索。