CSS寶馬圖標怎么畫？下面就由我來為大家介紹一下具體的步驟。

//先創建一個div用來存放三個圓
//然后添加樣式
.bmw-icon{
width: 100px;
height: 100px;
border-radius: 50%;
background-color: #1e1e1e;
position: relative;
}

接下來，我們來畫三個圓，分別代表寶馬的三個品牌：

//畫一個白色的小圓
.bmw-icon:before{
content: '';
width: 40px;
height: 40px;
border-radius: 50%;
background-color: #fff;
position: absolute;
top: 30px;
left: 10px;
}
//畫一個藍色的中圓
.bmw-icon:after{
content: '';
width: 60px;
height: 60px;
border-radius: 50%;
background-color: #0073AD;
position: absolute;
top: 20px;
left: 20px;
}
//畫一個白色的大圓
.bmw-icon span{
content: '';
width: 80px;
height: 80px;
border-radius: 50%;
background-color: #fff;
position: absolute;
top: 10px;
left: 10px;
}

最后，我們來給圖標添加上車標的標志-中間的藍色線條：

//畫一個藍色的線條
.bmw-icon:before{
content: '';
width: 40px;
height: 40px;
border-radius: 50%;
background-color: #fff;
position: absolute;
top: 30px;
left: 10px;
transform: rotate(45deg);
transform-origin: center;
border-left: 3px solid #0073AD;
border-bottom: 3px solid #0073AD;
}

好了，現在我們就成功的畫出了一個簡單的CSS寶馬圖標。