今天我們要介紹的主題是關(guān)于CSS圖片左側(cè)有小點(diǎn)的技巧。在網(wǎng)站設(shè)計(jì)中，使用小點(diǎn)來(lái)標(biāo)記內(nèi)容是一種非常流行的方式。這種技巧可以為用戶(hù)提供一個(gè)更加清晰和易于理解的視覺(jué)界面。

要實(shí)現(xiàn)這個(gè)效果，我們需要使用CSS中的偽類(lèi)選擇器:before。通過(guò)在偽類(lèi)選擇器中添加content: ""; 顯示CSS偽類(lèi)出現(xiàn)的文本內(nèi)容。

.dot:before {
content: "";
background-color: black;
width: 10px;
height: 10px;
border-radius: 50%;
display: inline-block;
margin-right: 10px;
}

以上代碼是實(shí)現(xiàn)左側(cè)小點(diǎn)的基本樣式，我們可以將它保存在一個(gè)CSS類(lèi)中，例如.dot。

然后在HTML中使用該樣式，將它添加到要顯示小點(diǎn)的元素中。

<div class="dot"></div>
<p>這是一個(gè)使用CSS小點(diǎn)的演示。</p>

通過(guò)以上代碼，我們就可以在段落的左側(cè)顯示一個(gè)小點(diǎn)。當(dāng)然，這只是CSS小點(diǎn)的一種最基本的形式，你可以通過(guò)添加不同的CSS樣式來(lái)改變小點(diǎn)的顏色、大小、位置和形狀，以滿(mǎn)足你的設(shè)計(jì)需求。