HTML基礎(chǔ)教程之HTML列表
HTML項目符號(無序列表)
網(wǎng)頁中的列表隨處可見,比如新聞頁面隨處可見這樣的列表
這些列表就可以使用ul-li標(biāo)簽來完成。ul-li是沒有前后順序的信息列表。
下面,我們來實現(xiàn)這樣的效果
語法:
<ul >
????<li>內(nèi)容1</li>
????<li>內(nèi)容2</li>
????<li>內(nèi)容3</li>
</ul>
<ul>或<li>的常用屬性
type:項目符號的類型,取值:disc(小黑點(diǎn))、circle(空心圓)、square(實心方塊)
實例:
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> </head> <body> <ul type="square"> <li>三星在大陸召回19萬臺Note7手機(jī) 可全額退款</li> <li>國土部等5部委:進(jìn)城落戶人口人均用地不超1百平米</li> <li>13位科學(xué)家實名呼吁對韓春雨啟動調(diào)查:為學(xué)界名聲</li> </ul> </body> </html>
注:在HTML標(biāo)記中,內(nèi)容應(yīng)該放在最底層標(biāo)記中。
HTML編號列表(有序列表)
網(wǎng)站之中還有這樣的列表
這類信息展示就可以使用<ol>標(biāo)簽來制作有序列表來展示。
語法:
<ol>
????<li>……</li>
????<li>……</li>
????<li>……</li>
</ol>
<ol>或<li>的常用屬性
?type:編號類型,取值:1、a、A、i、I
start:從第幾個開始編號(數(shù)字)。
改造上面一個例子:
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> </head> <body> <ol type="1" start="1"> <li>三星在大陸召回19萬臺Note7手機(jī) 可全額退款</li> <li>國土部等5部委:進(jìn)城落戶人口人均用地不超1百平米</li> <li>13位科學(xué)家實名呼吁對韓春雨啟動調(diào)查:為學(xué)界名聲</li> </ol> </body> </html>
注:大家可以嘗試改變屬性的值,看看輸出有什么變化