最近在網頁設計中，越來越多地出現了使用CSS圓圈配合感嘆號的設計，這種設計簡潔明了，又能起到引人注意的作用。今天，我們就來學習一下如何使用CSS制作一個圓圈感嘆號。

首先，我們需要創建一個HTML元素來容納圓圈感嘆號。我們可以使用一個div標簽，并設置它的class屬性為“circle-exclamation”：

<div class="circle-exclamation"></div>

接下來，我們需要通過CSS樣式來實現圓圈感嘆號的效果。首先，我們需要將div元素設置為圓形，我們可以使用“border-radius”屬性來實現：

.circle-exclamation {
width: 20px;
height: 20px;
border-radius: 50%;
}

我們將div的寬高均設置為20像素，并將“border-radius”屬性設置為50%以實現圓形效果。

接著，我們需要在圓圈內部放置一個感嘆號。我們可以使用“::before”偽元素來實現：

.circle-exclamation::before {
content: "!";
font-size: 16px;
color: #fff;
line-height: 20px;
text-align: center;
display: block;
}

我們將“content”屬性設置為感嘆號“!”，將字體大小設置為16像素，將顏色設置為白色，將行高設置為與div元素相同的20像素，將文本居中對齊，并將其設置為塊級元素。

最后，我們只需要將背景顏色設置成自己想要的顏色即可：

.circle-exclamation {
background-color: #eb4d4b;
}

這樣，一個漂亮的圓圈感嘆號就制作完成了！

總之，使用CSS制作圓圈感嘆號是一項相當簡單的技術，但它能為你的網頁增添無窮的設計靈感，所以趕快去試試吧！