html中怎樣讓多個li標籤橫排顯示

HTML的li標籤預設為豎向顯示。下面，我們來看看html中怎樣讓多個li標籤橫排顯示吧。

操作方法

（01）HTML頁面使用Visual Studio軟體新建出一個HTML頁面，如下圖所示：

（02）li程式碼在body標籤內輸入li標籤的相關程式碼，如下所示： <ul> <li>模組一</li> <li>模組二</li> <li>模組三</li> <li>模組四</li> <li>模組五</li> <li>模組六</li> <ul>

（03）瀏覽器中顯示程式碼在瀏覽器中顯示的結果圖可以看到li標籤為豎向顯示，如下圖所示：

（04）橫排顯示讓li標籤橫排顯示的程式碼如下所示： #nav ul li { float:left; list-style:none; }

（05）效果圖li標籤橫向顯示的效果圖如下圖所示：