CSS3是一項強大的標準，可以輕松地創建出炫目的效果。在本文中，我們將介紹如何使用CSS3創建鉛筆箭頭。

.arrow {
position: relative;
display: inline-block;
width: 0;
height: 0;
border-style: solid;
border-width: 5px 0 5px 10px;
border-color: transparent transparent transparent #000;
}
.arrow:before {
content: "";
position: absolute;
top: -5px;
left: -10px;
width: 0;
height: 0;
border-style: solid;
border-width: 5px 0 5px 10px;
border-color: transparent transparent transparent #fff;
}
.arrow:after {
content: "";
position: absolute;
top: -5px;
left: -12px;
width: 0;
height: 0;
border-style: solid;
border-width: 6px 0 6px 12px;
border-color: transparent transparent transparent #000;
}

上面的代碼中，我們使用了Pseudo-Elements來分別創建箭頭的兩段和箭頭頂端的三角形。我們在主元素上設置了position: relative屬性，以便讓偽元素相對于它進行定位。

通過設置不同的border-width和border-color屬性，我們可以呈現出不同的箭頭樣式。這是CSS3的一個非常強大的功能，可以讓我們輕松地創建出各種復雜的效果。

如果您想嘗試一些不同的樣式，可以更改border-width、border-color和箭頭的角度。請注意，角度實際上是通過調整箭頭的邊框寬度，而不是旋轉箭頭元素來實現的。

總的來說，使用CSS3創建鉛筆箭頭是一個簡單而有趣的過程。它可以幫助您加強您的設計技能，并讓您的網站更加生動活潑。