CSS3擁有許多酷炫的效果，其中之一就是創(chuàng)建漂亮的菜單。它可以讓你的網(wǎng)站看上去更加專業(yè)和吸引人。下面我們來學習如何創(chuàng)建CSS3漂亮菜單。

/*CSS代碼*/
.menu {
display: flex;
justify-content: space-between; 
width: 100%;
background-color: #222;
}
.menu a {
color: #fff;
text-decoration: none;
padding: 10px;
font-size: 1.2rem;
transition: all 0.3s ease-in-out;
}
.menu a:hover {
background-color: #fff;
color: #222;
border-radius: 5px;
}

以上代碼就是用來創(chuàng)建一個漂亮的菜單。其中menu類被設(shè)置為 Flex 布局，使它的子元素可以水平分布并且寬度等分。每個菜單項都是一個網(wǎng)站鏈接。當用戶將鼠標懸停在菜單項上時，背景顏色將變?yōu)榘咨谋绢伾瓦吙虬霃揭蚕鄳?yīng)地改變了。這樣可以提高用戶體驗和表現(xiàn)力。

在使用CSS3來創(chuàng)建菜單時，在不同瀏覽器上它們的樣式可能會不同。因此需要使用prefix(前綴) 來保證兼容性。

如此一來，我們就可以輕松地創(chuàng)建出一個漂亮的菜單，而且它能夠在各個瀏覽器中正確顯示。