明輝手游網(wǎng)中心:是一個免費提供流行視頻軟件教程、在線學(xué)習(xí)分享的學(xué)習(xí)平臺!

HTML li標簽是干嘛的?HTML li標簽用法與屬性的說明

[摘要]HTML li標簽是干嘛的?HTML li標簽用法和屬性的介紹都在這里,這篇文章給大家講述的是HTML li標簽的定義及屬性介紹,還有html li標簽如何去掉無序列表中的默認小點樣式。HTML li標簽的定義和用法:<li> 標簽定義列表項目。<li>標簽(全稱為list...
HTML li標簽是干嘛的?HTML li標簽用法和屬性的介紹都在這里,這篇文章給大家講述的是HTML li標簽的定義及屬性介紹,還有html li標簽如何去掉無序列表中的默認小點樣式。

HTML li標簽的定義和用法:

<li> 標簽定義列表項目。

<li>標簽(全稱為list item)是HTML語言中的一個元素標簽。屬于列表標簽。以<li>開始</li>結(jié)束,<li> 標簽可用在有序列表 (<ol>) 和無序列表 (<ul>) 中。

HTML <li> 標簽用法實例:

<ol>
   <li>Coffee</li>
   <li>Tea</li>
   <li>Milk</li>
</ol>
 <ul>
   <li>Coffee</li>
   <li>Tea</li>
   <li>Milk</li>
</ul>

HTML li標簽的屬性:

tuyi.pngHTML li標簽的用法詳細說明:

無序列表是一個項目的列表 [1] ,此列項目使用粗體圓點(典型的小黑圓圈)進行標記。無序列表始于 <ul> 標簽。每個列表項始于 <li>。例:

<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>

瀏覽器顯示如下:

·Coffee

·Milk

列表項內(nèi)部可以使用段落、換行符、圖片、鏈接以及其他列表等等。

有序列表也是一個項目的列表,列表項目使用數(shù)字進行標記。有序列表始于 <ol> 標簽。每個列表項始于 <li> 標簽。例:

<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>

瀏覽器顯示如下:

1.Coffee

2.Milk

列表項內(nèi)部可以使用段落、換行符、圖片、鏈接以及其他列表等等。

HTML li標簽如何去點無序列表中的小點:

首先來看看我們使用列表標簽出現(xiàn)的問題。

<ul>
<li>1</li><li>2</li><li>3</li><li>4</li><li>5</li>
</ul>

我們發(fā)現(xiàn)會出現(xiàn)了一個黑的小點點。因為我們使用的是無序列表標簽。那么要怎么除去這些點點呢。

接下來看看怎么解決問題咯。先打開記事本或者其他的html編輯器。我使用的editplus.新建一個html文件

在源代碼中加入如下的代碼:

ul li{
list-style: none;
}

這樣就可以去除默認的樣式了。當然你也可以直接寫在標簽里面把樣式,不過我推薦大家使用這種這發(fā),使得代碼后期方便維護。

還有更直觀的辦法:


<html>
  <head>
  <style>
   ul,  li{display:block; position:relative;}
   li{float:left; margin:auto 10px; list-style:none; height:30px; line-height:30px;}
   .cle{clear:both;}
   </style>
  </head>
<body>
  <ul>
   <li><a href = "
http://www.baidu.com
">百度</a></li>
  <li><a href = "
http://www.sina.com.cn
">新浪</a></li>
   <li><a href = "
http://www.163.com
">網(wǎng)易</a></li>
   <li><a href = "
http://www.qq.com
">騰訊</a></li>
   <li><a href = "
http://www.php.cn
">PHP中文網(wǎng)</a></li>
   <li><a href = "
http://www.google.com.hk
">谷歌</a></li>
 <div class="cle"></div>
  </ul>
</body>
</html>

HTML 與 XHTML 之間的差異

在 HTML 4.01 中,li 元素的 "type" 和 "value" 屬性是不被贊成使用的。

在 XHTML 1.0 Strict DTD 中,li 元素的 "type" 和 "value" 屬性是不被支持的。

【相關(guān)推薦】

html5 border屬性怎么設(shè)置?html5 table中的border屬性介紹

htm5新增的表單元素keygen標簽的用法和屬性介紹

以上就是HTML li標簽是干嘛的?HTML li標簽用法和屬性的介紹的詳細內(nèi)容,更多請關(guān)注php中文網(wǎng)其它相關(guān)文章!


網(wǎng)站建設(shè)是一個廣義的術(shù)語,涵蓋了許多不同的技能和學(xué)科中所使用的生產(chǎn)和維護的網(wǎng)站。