CSS購物車圖標是網(wǎng)上購物中常見的元素之一。它可以幫助用戶快速找到自己的購物車，方便用戶隨時查看購物車中已選商品。下面我們來看看如何創(chuàng)建一個CSS購物車圖標。

.shopping-cart-icon {
position: relative;
display: inline-block;
width: 30px;
height: 30px;
margin-right: 10px;
}
.shopping-cart-icon:before {
content: '';
display: block;
position: absolute;
border: 2px solid #000;
width: 20px;
height: 18px;
top: 0;
left: 50%;
margin-left: -10px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
}
.shopping-cart-icon:after {
content: '';
display: block;
position: absolute;
border: 2px solid #000;
border-top: none;
width: 14px;
height: 8px;
top: 20px;
left: 50%;
margin-left: -7px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}

代碼中，我們使用了:before和:after偽元素來創(chuàng)建購物車的兩個部分。在:before偽元素中，我們設置了寬度、高度、邊框樣式、位置等屬性，用來創(chuàng)建購物車的上半部分。在:after偽元素中，我們也設置了寬度、高度、邊框樣式、位置等屬性，用來創(chuàng)建購物車的下半部分。

在這個代碼的基礎上，你可以按照自己的需求進行更改。你可以改變購物車圖標的顏色、大小、位置等屬性，來滿足你自己的需求。同時也可以添加其他元素來實現(xiàn)更多的功能。