CSS可以幫助我們輕松地給網頁添加不同的樣式和元素。其中一種很有用的效果是在文字前面加上一個小方框，看起來既美觀又實用。 要實現這個效果，可以利用CSS的偽元素:before。我們可以添加以下代碼到CSS樣式表中： ``` p:before { content: ""; display: inline-block; width: 10px; height: 10px; background-color: #ccc; margin-right: 10px; } ``` 這里，我們使用了:before偽元素來在每個p標簽前面添加一個小方塊。我們設置content屬性為空，它用來讓:before元素出現在p元素前面。我們還設置了一個display屬性為inline-block，讓方塊和文字保持在同一行。寬度和高度分別是10像素，并且我們設置完整背景色為#ccc。最后，我們設置了一個margin-right屬性，以便在方塊和文本之間留出一些空白。 在HTML代碼中，我們只需要寫一個簡單的p標簽就可以了： ```

這是一個帶小方框的段落。

``` 瀏覽器渲染后，我們會看到每個p標簽前面都有一個小方塊，讓整個頁面看起來更清晰和組織好。這是一個簡單而強大的技巧，可以使網站看起來更專業和有條理。 ``` 預覽效果如下： □ 這是一個帶小方框的段落。 ```