CSS中的::after是偽元素，它可以用來在元素的內容之后插入一些內容。而::after的應用之一就是進行縮略。

.ellipsis {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.ellipsis::after {
content: "";
display: inline-block;
width: 1em;
height: 1em;
margin-left: 0.2em;
background-color: #000;
border-radius: 50%;
}

上面這段代碼實現了一個帶圓點的縮略效果。首先通過white-space: nowrap;、overflow: hidden;、text-overflow: ellipsis;實現了內容超出則省略的效果，接著通過::after插入了一個小圓點。其中，display: inline-block;讓圓點能夠和內容在同一行顯示，通過width和height控制大小，margin-left: 0.2em調整圓點與內容的間距，background-color設置顏色，border-radius: 50%;將方形變為圓形。

除了圓點，我們還可以用偽元素生成箭頭、圖標等，實現不同的縮略效果。這是CSS中::after功能的又一體現，為我們的設計帶來更多可能。