HTML无序列表| HTML项目符号列表

本文概述

HTML无序列表示例
ul type =“ circle”
ul type =“ square”
ul type =“ none”
支持的浏览器

HTML无序列表或项目符号列表以项目符号格式显示元素。我们可以使用无序列表, 而无需按任何特定顺序显示项目。 HTML ul标签用于无序列表。项目符号列表可以有4种类型：

碟片
圈
广场
没有

为了表示不同的有序列表, <ul>标记中有4种类型的属性。

类型	描述
Type “disc”	这是默认样式。在这种样式中, 列表项用项目符号标记。
Type “circle”	在这种样式中, 列表项用圆圈标记。
Type “square”	在这种样式中, 列表项用正方形标记。
Type “none”	在这种样式中, 列表项未标记。

HTML无序列表示例

<ul>
 <li>HTML</li>
 <li>Java</li>
 <li>JavaScript</li>
 <li>SQL</li>
</ul>

立即测试

输出：

的HTML
爪哇
的JavaScript
的SQL

ul type =“ circle”

<ul type="circle">
 <li>HTML</li>
 <li>Java</li>
 <li>JavaScript</li>
 <li>SQL</li>
</ul>

立即测试

输出：

的HTML
爪哇
的JavaScript
的SQL

ul type =“ square”

<ul type="square">
 <li>HTML</li>
 <li>Java</li>
 <li>JavaScript</li>
 <li>SQL</li>
</ul>

立即测试

输出：

的HTML
爪哇
的JavaScript
的SQL

ul type =“ none”

<ul type="none">
 <li>HTML</li>
 <li>Java</li>
 <li>JavaScript</li>
 <li>SQL</li>
</ul>

立即测试

输出：

的HTML
爪哇
的JavaScript
的SQL

注意：HTML5不支持type属性, 可以使用list-style-type的CSS属性代替type。以下是显示ul标签的CSS属性的示例。

<ul style="list-style-type: square;">
	<li>HTML</li>
	<li>Java</li>
	<li>JavaScript</li>
	<li>SQL</li>
  </ul>

码：

<!DOCTYPE html>
<html>
 <head>
  </head>
 <body>
 <h2>The type attribute with CSS property</h2>
   <ul style="list-style-type: square;">
	<li>HTML</li>
	 <li>Java</li>
           <li>JavaScript</li>
           <li>SQL</li>
    </ul>
 </body>
</html>

立即测试

输出：