在 CSS 樣式中,<ul>
是 HTML 中的無(wú)序列表標(biāo)記,常用于網(wǎng)頁(yè)上的菜單或其他列表的排版。
<ul class="menu"> <li>首頁(yè)</li> <li>關(guān)于我們</li> <li>服務(wù)項(xiàng)目</li> <li>聯(lián)系我們</li> </ul>
上面的代碼是一個(gè)簡(jiǎn)單的菜單列表,其中<ul class="menu">
表示一個(gè)無(wú)序列表,該列表的樣式屬性可通過(guò) CSS 進(jìn)行控制。
通過(guò)樣式表,我們可以設(shè)置<ul>
標(biāo)記的樣式,如下面的代碼所示:
.menu { list-style: none; text-align: center; background-color: #333; color: #fff; padding: 10px 0; } .menu li { display: inline-block; margin: 0 10px; }
上面的代碼中,通過(guò).menu
和.menu li
分別設(shè)置了<ul>
和<li>
標(biāo)記的樣式。
其中list-style
屬性用于去除默認(rèn)的列表符號(hào),text-align
屬性用于居中,background-color
和color
屬性用于設(shè)置背景和文字顏色,padding
屬性用于設(shè)置內(nèi)邊距。
.menu li
中的display
屬性用于將列表項(xiàng)設(shè)置為內(nèi)聯(lián)元素,margin
屬性用于設(shè)置列表項(xiàng)間的間距。
通過(guò)上述代碼,我們可以輕松地改變無(wú)序列表的樣式,在頁(yè)面上實(shí)現(xiàn)各種不同風(fēng)格的菜單或列表排版。