CSS3中的nav標(biāo)簽是用于定義導(dǎo)航條的元素,通常用于網(wǎng)站的頭部或側(cè)邊欄。
<nav> <ul> <li><a href="#">首頁(yè)</a></li> <li><a href="#">關(guān)于我們</a></li> <li><a href="#">聯(lián)系我們</a></li> </ul> </nav>
以上是nav標(biāo)簽的一個(gè)基本示例,nav標(biāo)簽內(nèi)通常包含一個(gè)ul列表,列表中通過(guò)li和a標(biāo)簽來(lái)定義導(dǎo)航欄中的每一個(gè)菜單項(xiàng)。
除了基本的樣式外,CSS3的nav標(biāo)簽還可以通過(guò)一系列的選擇器來(lái)設(shè)置不同狀態(tài)下的樣式,例如懸停、選中和當(dāng)前頁(yè)面所在位置的菜單項(xiàng)樣式。
nav ul li:hover { background-color: #ddd; } nav ul li.active { background-color: #000; color: #fff; }
通過(guò):hover偽類選擇器來(lái)設(shè)置鼠標(biāo)懸停時(shí)的樣式,通過(guò).active類選擇器來(lái)設(shè)置當(dāng)前頁(yè)面所在位置的菜單項(xiàng)樣式。
總之,使用CSS3的nav標(biāo)簽可以方便地創(chuàng)建網(wǎng)站中的導(dǎo)航條,并且十分靈活方便。