技術標籤：筆記

使用偽類搭配unicode來實現箭頭，可以免去一些常見圖片的載入，做起來也很方便

實現效果如下圖所示

做法：

1.搜尋需要的unicode，我使用的網站是unicode字元百科

2.複製需要字元的css程式碼

3.寫程式碼，原來的元素定位relative,偽類絕對定位

li{
  padding-left: .5rem;
  position: relative;
}
li:after{
  content: "\u1433";
  position: absolute;
  right: .5rem;
  font-size: .3rem;
}
// 左邊的圖示相關程式碼，左邊圖示還是需要引入的
li:nth-of-type(1)
 
{
  background: no-repeat url('./icon.png');
  background-size: 0.3733rem 0.3733rem;
  background-position: left center;
}
li:nth-of-type(2){
 ...省略
}
li:nth-of-type(3){
 ...省略
}