有朋友說(shuō)MB5U現(xiàn)在的教程還不夠傻瓜化，有些東東可能對(duì)于新手一時(shí)還難以理解。
　　我們將陸續(xù)的推出一些最基礎(chǔ)的教程與CSS布局的方法、案例。滿足新手的需要。假如你已經(jīng)對(duì)CSS有一些了解，這些教程就可以忽略了。

　　今天介紹如何用ul和li制作橫向菜單。ul是html中的無(wú)序列表，li是列表中的列表項(xiàng)。假如沒有CSS定義它的外觀，它默認(rèn)是顯示成一列列表，并且它會(huì)存在項(xiàng)目符號(hào)（比如方塊或?qū)嵭牡暮邳c(diǎn)）的列表內(nèi)容。
　　CSS網(wǎng)頁(yè)布局中，除了新聞列表、鏈接運(yùn)行ul、li制作以外，我們通常將菜單也用ul、li來(lái)實(shí)現(xiàn)。我們下面用CSS來(lái)改變它的外觀，使它能橫向在一行中顯示，并且將項(xiàng)目符號(hào)去掉。

　　我們看下面的XHTML代碼：


　　我們建立了一個(gè)id為nav的無(wú)序列表，包含了五個(gè)列表項(xiàng)li，這就是我們的菜單了。我們通過(guò)下面的css代碼，對(duì)它進(jìn)行重新定義：


　　對(duì)id為nav的無(wú)序列表中的列表項(xiàng)li，我們進(jìn)行CSS定義。每句代碼的意義解釋如下：
　　display: inline;　內(nèi)聯(lián)（行內(nèi)）。將li限制在一行來(lái)顯示。
　　list-style-type: none;　列表項(xiàng)預(yù)設(shè)標(biāo)記為無(wú)。這就去掉了“方塊或?qū)嵭牡暮邳c(diǎn)”
　　padding: 5px 10px;　設(shè)置li的填充，距離上下均為5px，距離左右均為10px.
　　這樣定義以后，我們的列表就有一個(gè)菜單的雛形了，它看上去不是很美觀，我們?cè)贛B5U.com以后的教程中，再對(duì)它進(jìn)行更加深入的修飾。

　　最終的運(yùn)行效果：