先引入layui的樣式代碼，

2創(chuàng)建html代碼，添加上layui的導(dǎo)航樣式，layui-nav

3運(yùn)行頁(yè)面，我們就可以看到一個(gè)美觀的導(dǎo)航菜單了。

4現(xiàn)在的菜單右邊有很多空白的地方，我們可以添加樣式，為導(dǎo)航欄條目添加長(zhǎng)度，讓其布滿頁(yè)面。

先看下現(xiàn)在默認(rèn)的導(dǎo)航欄的樣式，并沒有設(shè)置寬度，默認(rèn)是自適應(yīng)文字寬度。

5我們添加一個(gè)樣式，注意樣式名和剛才默認(rèn)的樣式名一樣。添加width:25%的樣式。

6再次運(yùn)行頁(yè)面，現(xiàn)在導(dǎo)航欄的條目布滿了，沒有留下過多的空白了。

7除了使用百分比來設(shè)置寬度，我們還可以設(shè)置成固定的長(zhǎng)度值，比如width:140px。

這個(gè)數(shù)值取決于你的整個(gè)頁(yè)面的寬度值，和有多少個(gè)導(dǎo)航條目，條目多的，數(shù)值就要設(shè)置小一點(diǎn)，條目少的，就要設(shè)置大一點(diǎn)