CSS是網(wǎng)頁(yè)設(shè)計(jì)的重要組成部分，它可以通過多層ul li嵌套實(shí)現(xiàn)網(wǎng)頁(yè)的多級(jí)導(dǎo)航和列表展示。

ul{ 
list-style:none;
margin:0;
padding:0;
}
li{
position:relative;
display:inline-block;
width:100px;
height:30px;
line-height:30px;
text-align:center;
}
li:hover>ul{
display:block;
}
li>ul{
position:absolute;
left:0;
top:30px;
display:none;
}

上述 CSS 代碼實(shí)現(xiàn)了列表的初始化，定義了每個(gè) li 元素的樣式，并使其具有在鼠標(biāo)懸停時(shí)顯示下屬列表的功能。我們可以通過嵌套 ul li 標(biāo)簽的方式，實(shí)現(xiàn)多層列表的嵌套。

<ul>
<li>
<a href="#">一級(jí)菜單1</a>
<ul>
<li><a href="#">二級(jí)菜單1</a></li>
<li><a href="#">二級(jí)菜單2</a></li>
<li>
<a href="#">二級(jí)菜單3</a>
<ul>
<li><a href="#">三級(jí)菜單1</a></li>
<li><a href="#">三級(jí)菜單2</a></li>
<li><a href="#">三級(jí)菜單3</a></li>
</ul>
</li>
</ul>
</li>
<li>
<a href="#">一級(jí)菜單2</a>
<ul>
<li><a href="#">二級(jí)菜單4</a></li>
<li><a href="#">二級(jí)菜單5</a></li>
</ul>
</li>
</ul>

通過上述代碼，我們可以看到第一級(jí)菜單下嵌套了二級(jí)菜單，二級(jí)菜單下還可以繼續(xù)嵌套三級(jí)菜單。這樣，我們就可以實(shí)現(xiàn)更加豐富多彩的列表展示效果。