CSS3中的after偽元素用于在已有元素的后面插入一些內(nèi)容。它通常用于添加裝飾性質(zhì)的內(nèi)容，比如箭頭、圖標(biāo)等等。在使用after偽元素時，需要使用content屬性來指定內(nèi)容的具體內(nèi)容。下面是一個例子：

.example::after {
content: "→";
}

上面的代碼表示在class名為example的元素后面添加一個箭頭。需要注意的是，在使用after偽元素時，必須為它指定display屬性，通常為block或inline-block，否則after偽元素將不會生效。下面是一個完整的例子：

.example {
background-color: #333;
color: #fff;
display: inline-block;
padding: 5px 10px;
position: relative; // 這一步很重要！
}
.example::after {
content: "";
display: block;
width: 0;
height: 0;
border-top: 10px solid transparent;
border-right: 10px solid #333;
border-bottom: 10px solid transparent;
position: absolute;
top: 50%;
right: -10px; // 箭頭離元素右側(cè)的距離
transform: translateY(-50%); // 垂直居中
}

上面的示例代碼演示了如何在一個元素的右側(cè)添加一個箭頭。需要注意的是，在這個例子中，必須為父級元素設(shè)置position: relative;屬性，否則箭頭的定位將會出問題。