HTML基礎教程之HTML列表
HTML項目符號(無序列表)
網(wǎng)頁中的列表隨處可見,比如新聞頁面隨處可見這樣的列表
這些列表就可以使用ul-li標簽來完成。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(小黑點)、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手機 可全額退款</li> <li>國土部等5部委:進城落戶人口人均用地不超1百平米</li> <li>13位科學家實名呼吁對韓春雨啟動調(diào)查:為學界名聲</li> </ul> </body> </html>
注:在HTML標記中,內(nèi)容應該放在最底層標記中。
HTML編號列表(有序列表)
網(wǎng)站之中還有這樣的列表
這類信息展示就可以使用<ol>標簽來制作有序列表來展示。
語法:
<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手機 可全額退款</li> <li>國土部等5部委:進城落戶人口人均用地不超1百平米</li> <li>13位科學家實名呼吁對韓春雨啟動調(diào)查:為學界名聲</li> </ol> </body> </html>
注:大家可以嘗試改變屬性的值,看看輸出有什么變化