什么时候在 html 中使用 UL 或 OL？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/1039827/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
when to use UL or OL in html?
提问by omg
Seems interchangable?
好像可以互换？
回答by Randolpho
UL means "unordered list". OL means "ordered list".
UL 的意思是“无序列表”。OL 的意思是“有序列表”。
UL gets you bullet points. OL gets you numbers.
UL 为您提供要点。OL 为您提供数字。
Definitely not interchangable.
绝对不能互换。
回答by Ben Blank
In math terms (hey, why not?), an <ol>represents a sequence, whereas <ul>represents a set. Rearranging the items in an ordered list changes the list's meaning. Rearranging them in an unordered list does not.
在数学术语中（嘿，为什么不呢？），an<ol>代表一个序列，而<ul>代表一个集合。重新排列有序列表中的项目会更改列表的含义。在无序列表中重新排列它们不会。
This is a good rule-of-thumb for which type of list to use. If changing the order of the items makes the list incorrect, you want to use <ol>. If the order doesn't matter, use <ul>.
这是使用哪种类型的列表的一个很好的经验法则。如果更改项目的顺序使列表不正确，您需要使用<ol>. 如果顺序无关紧要，请使用<ul>.
回答by basaundi
With <ol>the order of the data is important and will be displayed (by default) while with <ul>, order isn't as important.
Example:
与<ol>该数据的顺序是重要的，将被显示的（默认），同时用<ul>，顺序并不重要。例子：
<p>Tomorrow I will</p>
<ol>
<li>Wake up</li>
<li>Have breakfast</li>
<li>Go to sleep</li>
</ol>
<p>During breakfast, I will eat</p>
<ul>
<li>Butter</li>
<li>Eggs</li>
<li>Bacon</li>
</ul>
回答by Ian Elliott
One is ordered list (OL), it is for things that have a defined and distinct order. There is a reason behind why they are organized.
一种是有序列表（OL），它用于具有定义和不同顺序的事物。它们被组织起来是有原因的。
The other (UL) is unordered list, which is just a collection of things in no specified order. Their organization is trivial.
另一个（UL）是无序列表，它只是没有指定顺序的事物的集合。他们的组织是微不足道的。
回答by poundifdef
Haha, so many answers!
哈哈，这么多答案！
When HTML first came out, there were OLand UL, which, as all of the other posters have said, meant Ordered List and Unordered List.
当 HTML 首次出现时，有OL和UL，正如所有其他发布者所说，这意味着有序列表和无序列表。
The difference was easy. OLs displayed... a number next to them. Or a roman numeral, or a letter! You could even control whether it used capitalized symbols or lowercase! Cool!
区别很简单。OLs 显示......他们旁边的一个数字。或罗马数字，或字母！您甚至可以控制它是使用大写符号还是小写！凉爽的！
ULs gave you bullets. 3 types of bullets, even - discs (hollow circles), squares (filled squares), circles (filled circles.)
UL 给了你子弹。3 种类型的子弹，甚至 - 圆盘（空心圆）、正方形（实心正方形）、圆形（实心圆）。
There was no CSS. Beyond these attributes, there wasn't really a way to customize the list formats (and margins and indententations and everything else.) So, this distinction was important.
没有 CSS。除了这些属性之外，并没有真正自定义列表格式（以及边距和缩进以及其他所有内容）的方法。因此，这种区别很重要。
Nowadays, its all CSS. In fact, the w3 people want you to use styles rather than the html "type" attribute that you used to use. So, using UL vs OL doesn't really matter, if you are one of them newfangled CSS users.
如今，它的所有CSS。事实上，w3 人希望您使用样式而不是您过去使用的 html“类型”属性。因此，使用 UL 与 OL 并不重要，如果您是其中一位新奇的 CSS 用户。
CSS lets you change the bullet type, or opt to use an image, or change the margins/styles/indentations, or not even display a bullet at all.
CSS 允许您更改项目符号类型，或选择使用图像，或更改边距/样式/缩进，甚至根本不显示项目符号。
Edit again: This answer isn't really meant to address the semantic merits of UL vs OL. But technically (you know, at the bits and bytes) the above outlines the differences in behavior.
再次编辑：这个答案并不是真的要解决 UL 与 OL 的语义优点。但从技术上讲（你知道，在位和字节）上面概述了行为的差异。
回答by Zach
OL:
OL：
- List item 1
- List item 2
- 列出项目 1
- 列出项目 2
UL:
UL：
- List item 1
- List item 2
- 列出项目 1
- 列出项目 2
OL is ordered list, UL is unordered list
OL 是有序列表，UL 是无序列表
回答by Matthew Groves
I think it's a sematic issue, as the numbering/bullet points can be changed by CSS.
我认为这是一个语义问题，因为编号/项目符号点可以通过 CSS 更改。
Ordered lists should be things like instructions, or any sequential information.
有序列表应该是诸如指令或任何顺序信息之类的东西。
Unordered lists should be everything else.
无序列表应该是其他一切。
回答by Neil
As the question asks "when to use them", I thought appropriate to offer examples of when, I usually decide to use OL when I want a series of steps, and UL when I want to offer choices:
当问题询问“何时使用它们”时，我认为提供何时使用的示例是合适的，当我想要一系列步骤时，我通常决定使用 OL，而当我想提供选择时，我决定使用 UL：
Ordered list
有序列表
Here the stepsare critical for the business case, we must do the steps in this order, therefore an ordered list is used.
这里的步骤对于业务案例至关重要，我们必须按此顺序执行这些步骤，因此使用了有序列表。
Checkout stages on eCommerce, these steps will be in this order.
电子商务上的结帐阶段，这些步骤将按此顺序排列。
<ol>
<li>shipping</li>
<li>billing</li>
<li>summary</li>
<li>confirmation</li>
</ol>
Unordered list
无序列表
A user may decide on the order they choose to interact with these choices
用户可以决定他们选择与这些选择交互的顺序
<ul>
<li>Contact Us</li>
<li>Newsletter Signup</li>
<li>Terms</li>
<li>Log out</li>
</ul>
回答by joebert
Use OL when you're listing steps that need to be done in a certain order. Use UL when you're listing items in no particular order of importance.
当您列出需要按特定顺序完成的步骤时，请使用 OL。当您没有按特定的重要性顺序列出项目时，请使用 UL。
回答by karora
In some cases (specifically used by Screen Readers for people with special needs) you may want to have ordered list but not have numbers associated with them due to visual design. Ex. when you've let's say instructions on a page to fill up a form and want screen readers to take advantage of ordered items in the instructions then it will be useful. For all visual purposes they can be made to look exactly the same through CSS. It's the (non-visual, but helpful to screen reader) semantics that are different and at times useful.
在某些情况下（屏幕阅读器专门为有特殊需要的人使用），由于视觉设计，您可能希望有有序列表但没有与它们相关联的数字。前任。当您在页面上说填写表单的说明并希望屏幕阅读器利用说明中的订购项目时，它将很有用。对于所有视觉目的，它们可以通过 CSS 看起来完全相同。这是（非视觉的，但对屏幕阅读器有帮助）语义是不同的，有时是有用的。
