显示数字和大写字母的<ol>子列表
<ol>子列表是HTML中用于创建有序列表的元素。它可以包含一系列的列表项，每个列表项通常以数字或字母作为标记。这种有序排列的列表可以提供结构化的信息展示。
<ol>子列表的分类：
- 数字型有序列表：数字型有序列表使用数字作为标记，依次递增，可以用来表示项目的顺序或重要性等。
- 字母型有序列表：字母型有序列表使用字母作为标记，通常用于表示分类、子项目等。
<ol>子列表的优势：
- 提供了清晰的结构化信息展示：有序列表的使用可以使信息更加有序、易读和易理解。
- 有助于组织和分层展示：通过使用子列表，可以将信息按照层次结构组织起来，使得读者能够更好地理解信息的关联性。
- 方便修改和调整：使用有序列表可以方便地调整和修改列表项的顺序。
<ol>子列表的应用场景：
- 说明步骤或流程：有序列表常用于列举步骤或流程，例如教程、操作指南等。
- 列举要点或关键信息：有序列表可以用于列举要点或关键信息，使之更加突出和易于记忆。
- 展示分类或子项目：有序列表也可以用于展示分类或子项目，便于组织和分层展示相关内容。
推荐的腾讯云相关产品和产品介绍链接地址：
- 腾讯云云服务器（Elastic Cloud Server）：提供灵活可扩展的云服务器实例，满足不同规模和业务需求。 产品介绍链接：https://cloud.tencent.com/product/cvm
- 腾讯云对象存储（Cloud Object Storage）：提供高可靠、低成本、安全易用的对象存储服务，适用于图片、音视频、备份等各种场景。 产品介绍链接：https://cloud.tencent.com/product/cos
- 腾讯云人工智能（AI）：提供丰富的人工智能服务，包括图像识别、语音识别、自然语言处理等，可用于构建智能应用。 产品介绍链接：https://cloud.tencent.com/product/ai
相关·内容
1回答
我试图创建一个有序的列表，其中编号样式也是嵌套列表中的字母数字字符。
示例：
a. one
b. two
b.a. three
b.b. four
b.c. five
c. six
c.a. seven
c.a.a. eight
c.b. nine
c.b.a. ten
d. eleven
我尝试过将列表样式类型设置为较低的alpha类型，但它不能正确地对嵌套列表进行编号。我用这样的数字实现了我想要的：
ol {
counter-reset: section;
list-style-type: none;
}
li
浏览 1提问于2019-06-03得票数 3
回答已采纳
我试图使用HTML编写有序列表：
<p>Lorem ipsum dolor:</p>
<ul>
<ol>sit amet</ol>
<ol>sit amet</ol>
<ol>sit amet</ol>
</ul>
我试着用li代替ul：
<li>
<ol>sit amet</ol>
<ol>sit amet</ol>
<ol>sit
浏览 3提问于2021-04-23得票数 1
回答已采纳
我试图连接MySQL数据库的两个表，其中一个是两个列：
SELECT ol.utdate, ol.session, dl.utdate, dl.dsession FROM observation_log ol
LEFT OUTER JOIN diary_log dl ON (ol.utdate = dl.utdate AND ol.session = dl.dsession);
问题是ol.session是CHAR，dl.dsession是TINYINT(4)。这两个字母之间的对应是字母的整数：
=======================
ol.session||dl.dsession
浏览 2提问于2017-05-05得票数 2
回答已采纳
2回答
我有这样的页面：
<ul id="cards">
<li id="card1">
<div>...</div>
<div id="panel1">
<form>...</form>
<ol class="commentlist" id="commentlist1">
<li>...</li>
...
</
浏览 4提问于2011-11-15得票数 0
回答已采纳
我正在尝试创建此表，但表的有序列表计数不正确。我应该如何放置ol和li以使列表正确显示为1. Coffee 2. Tea。 <!DOCTYPE html>
<html>
<body>
<h1>The ol element</h1>
<table border="1">
<ol>
<tr>
<td>
<ol>
浏览 68提问于2021-06-17得票数 0
4回答
使用引导3.3.5和这个标记，
<div id="panelSteps" class="panel panel-default">
<div class="panel-heading hidden-print">Actions</div>
<ol class="item-steps list-group">
<li class="list-group-item"><a href="#">Some action&l
浏览 7提问于2016-02-02得票数 2
回答已采纳
2回答
是否有方法以网站语言显示有序列表的十进制数？例如，我在波斯语网站(<html lang="fa">)中有一个有序的列表，但是每个列表项目之前的十进制数用英语而不是波斯语显示！
波斯语中有序列表的标记示例：
<ol dir="rtl">
<li>کتابهای زیادی در شصت و سه درصد گذشته</li>
<li>چاپگرها و متون بلکه روزنامه و مجله</li>
<li>لورم ایپسوم متن سا
浏览 0提问于2018-07-31得票数 1
回答已采纳
1回答
下面的代码显示有两个嵌套列表。外边有文字装饰:直通式属性，另一种无直通式.我怎么才能移除这条内线--首先还是不应用它？！！我要“外”一词的直通式，而不是“内”字。
<DOCTYPE html>
<header><style>
ol li {text-decoration:line-through; color:red;}
ol li ul li{text-decoration:none; color:pink;}
</style></header>
<body>
<ol>
&l
浏览 0提问于2013-10-22得票数 3
回答已采纳
我不知道哪一种写作方式是正确的：
<ol><li>something</li><div>something</div><li>something</li></ol>
或
<ol><li>something<div>something</div></li><li>something</li></ol>
我必须在两个列表之间添加一个div标记和一个图像标记。好的，我得到了上面这两段代码的输出。但是我想知道哪
浏览 2提问于2020-01-02得票数 1
回答已采纳
我正在使用以下HTML (由codecademy提供)：
<ul>
<li>
<ol>
<li>Start with the function keyword</li>
<li>Inputs go between ()</li>
<li>Actions go between {}</li>
<li>jQuery is for chumps!</li&g
浏览 3提问于2015-10-03得票数 1
2回答
*不使用多个元素的伪类
、、、
我有一个元素列表，我想对除9和11以外的所有元素应用一些更改，因此我编写了如下内容：
.myList li:not(:nth-child(9)),
.myList li:not(:nth-child(11)) {
background-color: greenyellow;
}
<ol class="myList">
<li>One</li>
<li>Two</li>
<li>Three</li>
<li>Four</li>
<li>
浏览 0提问于2018-05-29得票数 0
回答已采纳
4回答
我试图使用HTML来：
创建2个有序列表
在每个O.L.内嵌套一个无序列表，并在其中添加一些元素
然而，我的编号并没有达到它应有的效果，我得到的是1.1，而不是1.2等等。
我的代码：
<ol>
<li>Fruits</li>
<ul>
<li>Apples</li>
<li>Oranges</li>
<li>Plum</li>
<li>Watermelon</li>
</ul>
浏览 5提问于2015-04-18得票数 2
在我的程序中，我有未排序的列表，它命令了lists.Requirement，就像单击ordereded列表元素时，子顺序列表应该打开：
下面是我编写的代码：
<html>
<head>
<title>The jQuery Example</title>
<script type="text/javascript" src="E:\development\JSPProject\jquery-2.1.4.js">
</script>
<
浏览 1提问于2015-07-31得票数 0
回答已采纳
我有以下元素列表：
<ol>
<li>First item</li>
<li>Second item</li>
<li>Third item</li>
</ol>
我想要显示从'C‘开始的列表，如下所示：
C First item
D Second item
E Third item
有可能吗？列表总是必须从'1'，'a'，‘A’等开始吗？
浏览 4提问于2009-07-28得票数 2
回答已采纳
2回答
我有html列表
<ol id="newlist">
<li>Test
<ol>
<li>1</li>
<li>2</li>
<li>3</li>
</ol>
</li>
<li>Another test
<ol>
浏览 0提问于2010-04-24得票数 1
回答已采纳
我有一个有序列表，其中任何版本的Internet Explorer都是1,1,1,1而不是1,2,3,4。在阅读了这个列表后，似乎发生了这种情况，因为在li上设置了宽度，您需要向li添加“display: list -item；”才能使其工作-我已经尝试过了，但没有结果，我也尝试过完全删除宽度，但也有同样的问题。
下面是我的清单：
<div id="nav">
<ul>
<li><a href="/">Home</a></li>
<li>
<
浏览 3提问于2013-01-25得票数 0
我试图将无序和有序的混合列表与下面的示例完全相同：
验证器给出了以下错误：
错误:元素“ul”在此上下文中不允许作为“ol”元素的子元素。
这是我的代码：
ol.numberlist{
list-style-type: decimal;
}
ul.sqaredotlist{
list-style-type:square;
}
ol.romanlist{
list-style-type:lower-roman;
}
<ol class="numberlist">
<li>An n
浏览 0提问于2019-03-21得票数 2
4回答
我使用创建和排序列表，并能够创建orderlist，默认情况下从1,2,3开始。文本角有两种模式：1.富文本模式1. HTML模式
HTML模式显示
<ol>
<li>test</li>
<li>test</li>
</ol>
富文本模式将显示为：
测试
测试
如果我需要开始编号为5的有序列表，我需要切换到 first并进行以下更改
<ol start="5">
<li>test</li>
<li>
浏览 3提问于2015-09-14得票数 0
回答已采纳
<ol type="1">
<div style="margin: 1em 0; margin-left: 45px;">
<li>
<div style="margin-top: 5px;">
Div Both before and after Li..... voima
</div>
</li>
</div>
<div style="margin: 1em 0; margin-left: 45px;"
浏览 0提问于2010-08-26得票数 0
1回答
我有一个嵌套的列，我用这段代码来动画.
var $li = $("ol#update li");
function animate_li(){
$li.filter(':first')
.animate({
height: 'show',
opacity: 'show'
浏览 5提问于2010-03-09得票数 0
回答已采纳
3回答
我有这个小问题，我正在构建一个嵌套的有序列表，我希望能够定制顶级元素的样式(请注意，粗体在计数器和文本中都有)。
1. AAA
1.1 Lorem ipsum
1.2 Lorem ipsum
1.3 Lorem ipsum
2.血脑屏障
2.1 Lorem ipsum
2.2 Lorem ipsum
2.3 Lorem ipsum
我遇到的问题是，如果我为列表的顶级元素应用任何<h>标记，计数器就会中断。
如果没有<h3>标记计数器，计数器就能正常工作，但是没有<h3>，我就无法为列表的顶级元素设置样式。
如何获得工作计数器和样式的顶级元素？
这里的
浏览 4提问于2016-03-02得票数 0
回答已采纳
你好，我有一个由三个有序列表组成的页面，它们之间有内容，所以有必要将它们分成三个不同的列表。我想控制的号码，第二和第三顺序列表开始。我使用psuedo :before作为我的订单列表，这样我就可以定制数字。
这是我的CSS：
.postid-1028 ol {
counter-reset: item;
list-style: none;
}
.postid-1028 ol li {
padding-left: 55px;
}
.postid-1028 ol li:before {
content: counter(item) ". ";
浏览 2提问于2016-10-03得票数 1
回答已采纳
在我的网站上，我有一个带小数的ol (list-style-type:decimal)。在Internet Explorer中，当列表超过9分贝时，分贝再次从0开始。
下面是它的显示方式，以及它在Firefox中的显示方式：
这是Internet Explorer7和6显示它的方式(IE8尚未测试)：
因此，列表再次从零开始。
列表的CSS：
ol {
list-style-image:none;
list-style-position:outside;
list-style-type:none;
}
ol li {
list-style-position:
浏览 0提问于2010-01-18得票数 0
回答已采纳
2回答
我在填充我的表时遇到了麻烦，我想通过一个元素数组生成一个表，并在一个有序列表中显示它，但是它显示了一个无序列表，为什么？我在下面附上我的代码，有什么问题吗？感谢您的回复
<table align="left">
<?php
echo "<ol type='A'>";
for ($i=0; $i < count($elements); $i++) {
echo "<tr>
<td>
浏览 11提问于2016-08-16得票数 0
我试图改变tinymce关于有序列表的行为(使用插件建议列表)，实际上，如果我键入一个有序列表，我就得到了这个html：
<ol>
<li>first item</li>
<li>second item</li>
<li>third item</li>
</ol>
如果在我的“标题1”之后，我按了两次，输入我的实际列表是分裂的，所以我有两个不同的列表，我不想那样…
我希望能够在原来的有序列表中插入另一个排序列表，如下所示：
<ol>
<li>first ite
浏览 0提问于2018-02-07得票数 0
我有这个html
<div class="multiple">
<ol>
<li>Ordered List Style</li>
<li>Here’s another, they shouldn’t be too terribly long, but might wrap a line or three
<ol>
<li>nested</li>
<li>nested</li>
<
浏览 2提问于2013-08-29得票数 0
3回答
我有一个罕见的要求：
我需要样式“列表样式:无”，只有当我有<ol>儿童和没有更多的标签。
例如，在本例中，我将应用样式：
<div>
<ol><li>1</li></ol>
<ol><li>2</li></ol>
</div>
在彼此中，我将禁用样式：
<div>
<p>
<ol><li>1</li></ol>
</div>
最好的方法是什么？谢谢
浏览 0提问于2012-08-17得票数 2
回答已采纳
也许我找错人了。我有一个有6列的表，每列都有一个有序列表。我希望它们都有一个边框，除了第一个列表。
基本上是这样的
<tr>
<td>
<ol>
<li>hello</li>
</ol>
</td>
<td>
<ol>
<li>hello</li>
</ol>
</td>
<td>
<ol>
<li>hello</li>
&
浏览 0提问于2010-02-04得票数 17
回答已采纳
下面是一些HTML：
<ol><ul><li>item</li></ul></ol>
还有一些用lxml解析并重新打印它的python 3代码：
import sys
from lxml import etree, html
document_root = html.fromstring(sys.stdin.read())
print(etree.tostring(document_root, encoding='unicode'))
这是输出：
<div><ol/><ul&
浏览 3提问于2021-07-26得票数 1
回答已采纳
我使用CSS网格为卡项列表创建水平滚动。当您到达水平滚动的末尾时，我需要在列表左边的第一项和右边列表上的最后一项保留间距。然而，当滚动在列表的中间时，两边不应该有任何间距。
需求
卡片列表开始处的间距(左边)
卡片列表末尾的间距(右边)
显示的卡片数量必须为2.5 (在页面加载时，显示2.5张卡片以表示水平滚动是有效的)
列表中的项数可能有所不同，因此无法使用显式网格。
它应该如何查看列表的开头，并在左侧显示间距的示例：
在右边滚动时它应该是什么样子，在左边不应该是什么样子的例子：
在列表的末尾，右边的空格应该是什么样子的例子：
这是一个。
浏览 1提问于2018-07-04得票数 5
回答已采纳
2回答
我正在做一个基本的重点练习，我不知道为什么它不起作用。在列表中有一个项的类是“选定的”，这也是主体的id，在css中，这样的id和类被调用来改变项的背景。
html：
<body id="selected">
<ol class="pagination" >
<li><a href="index.html" rel="prev">prev</a></li>
<li><a href="index.html"
浏览 0提问于2013-07-14得票数 0
2回答
我试图在父母列表中列出第一个孩子的样式：
ol:first-child > li {
color: red;
}
<ol>
<li>Numbered list item 1</li>
<li>Numbered list item 2
<ol>
<li>sublist item 1</li>
<li>sublist item 2</li>
</ol>
</li>
<li>Numbere
浏览 0提问于2018-05-22得票数 4
回答已采纳
1回答
我需要将项目编号的样式与文本本身的样式有所不同。有人问过类似的问题，但我没有找到解决办法。
示例：
ol[lang] li:before {
font-style: normal !important
}
* [lang] {
font-style: italic
}
<ol lang="la">
<li>Lorem Ipsum Dolor Sit Amet</li>
<li>Consectetur Adipiscing Elit</li>
<li>Aenean Porta Neq
浏览 5提问于2016-02-13得票数 2
我正在尝试创建嵌套列表：
<html>
<head>
<style>
ol li {
list-style: decimal outside none;
}
</style>
</head>
<body>
<ol>
<li>Digit</li>
<ul>
<li>Circle</li>
</ul>
&l
浏览 0提问于2012-08-04得票数 0
回答已采纳
我一直在做react中的待办事项列表，遇到了一个我一直难以解决的问题。我设法让todo列表动态更新我的数组状态，但在显示它时遇到了一些问题。下面是代码：(https://codesandbox.io/s/friendly-curran-fldtg?fontsize=14)。在顶部，我对一切都做了一个简短的解释。问题区域在底部，下面这行代码： const DisplayTasks = () => {
const { tasksarray } = this.state;
return (
<ol>
{tasksarray.map(eachTask =
浏览 15提问于2019-05-18得票数 0
回答已采纳
1回答
Angular指令协作
、、、
所以在这里我尝试用angular实现一个自动补全的建议，我需要你的专业知识。
下面是html：
<div my-autosuggest>
<input type="text" my-autosuggest-input>
<ol>
<li ng-repeat"item in items" my-autosuggest-list>...</li>
</ol>
</div>
我不想使用模板来生成<li>元素。(我希望它是灵活的，可以
浏览 0提问于2013-05-02得票数 2
回答已采纳
4回答
我有一个背景剪贴板图像，显示在<ol>中的第一个列表项目后面。
我希望它应用于所有的列表项(不仅仅是第一个)，我可以通过将类应用于每个<li>来实现这一点，但是当它应该在<ol>级别上工作时，这是不必要的。
上面只显示在第一个列表项下的背景剪贴板图像。我怎样才能让它在每一项清单上工作呢？
ol {
list-style: none;
padding: 0;
margin: 0;
counter-reset: orderedlist;
}
ol>li {
counter-increment: orderedlist;
浏览 0提问于2018-03-23得票数 0
回答已采纳
我有一个具有这种结构的嵌套有序列表
<ol>
<li>
<span>A</span>
<ol class="childol">
<li>
<span>A1</span>
</li>
<li>
<span>A2</span>
</li&
浏览 4提问于2011-03-17得票数 1
回答已采纳
4回答
我在使用jQuery选择器时遇到了麻烦，而我的代码也找不到问题。
我有一系列嵌套列表：
<ol id="chaps">
<li>Newton</li>
<ul class="assignments">
<li>One</li>
<li>Two</li>
</ul>
<li>Motion</li>
<ul class="assignments">
<li&g
浏览 0提问于2015-07-28得票数 1
回答已采纳
3回答
首先，为我的英语道歉，并为我对这个问题的糟糕解释道歉(这是我关于stackoverflow的第一个问题)。我将尝试更好地解释这个问题：
我有动态生成的(在WordPress帖子的可视编辑器中)嵌套的元素列表(执行某些操作的步骤)。我希望当我单击列表中的任何元素(步骤)时，此元素会以背景突出显示。这个目标看起来并不太难，我认为这段代码应该可以工作：
$('li').click(function(){
$(this).toggleClass('highlight'); //Alternate hihglight on click
$('.hi
浏览 0提问于2018-10-25得票数 2
在编写文档时，我使用有序列表中的有序列表创建了一个大纲，并使用CSS应用了伪合法样式的行编号。列表的默认行为是右对齐数字和左对齐文本；但是，我正在使用的CSS2代码片段正在改变这种行为，使数字左对齐，文本左对齐，尽管左对齐不正确。请参见以下示例：
默认行为(数字10突出显示所需的路线)：
1. Item
2. Item
1. Item
2. Item
1. Item
2. Item
3. Item
...
10. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Nun
浏览 3提问于2010-08-12得票数 3
回答已采纳
我有一个带有list-style-type属性特定值的有序列表，我希望它不影响它的子属性。
目前，有序列表有另一个嵌套在内部的有序列表，它继承了list-style-type值。我怎么能让它失效呢？
<ol class='custom-ol'>
<li> cat1:
<ol style="list-style-type:lower-alpha">
<li>text 1</li>
<li>text2</li>
</ol>
浏览 2提问于2017-03-08得票数 1
我们使用ASP.NET动态地创建有序和无序的列表(OL&UL)，它工作得很好，但是当我们使用“文本缩进”创建子列表时，它会创建一个块引号。
这是我们用来创建子列表的webkit命令。
document.execCommand('indent', false, null);
这是镀铬的结果。
<ol>
<li><span>This is Line One</span></li>
<li><blockquote><span>This is Line Two</span>
浏览 0提问于2014-12-24得票数 0
我已经注意到IE7中的一个奇怪的问题，我找不到解决方案。我有一个标准的有序列表，格式正确，所有的开始和结束标签都完好无损。
<ol>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
</ol>
除了Explorer 7之外，所有浏览器都可以正常显示该列表，该浏览器按如下方式呈现该列表：
1. Item 1
1. Item 2
1. Item 3
1. Item 4
以前有没
浏览 1提问于2011-03-24得票数 2
我已经搜索了这个论坛，但没有找到任何解决办法。如果列表元素的内容进入第二行，我的WordPress博客列表就不会正确缩进。我在堆栈溢出( )上找到了一个修复程序，我实现了它，如下所示：
.entry ol,.entry li {
margin: 0; padding: 0;
}
.entry ol {
counter-reset: foo;
display: table;
}
.entry li {
list-style: none;
counter-increment: foo;
display: table-row;
}
.entry li::before {
content: coun
浏览 2提问于2015-03-27得票数 0
我需要一个RegEx来匹配以冒号结尾的大写字符串。字符串可以包含空格、数字和句点。因此，如果：
mystring = "I have a C. GRAY CAT2:"
我想要coldfusion表达式
REFind("[A-Z0-9. ][:]",mystring)
返回数字9，匹配"C. GRAY CAT2:“。相反，它返回数字21，只匹配冒号。我希望修正判决将解决这一问题。当然，我尝试过很多很多事情。谢谢!
浏览 3提问于2017-09-27得票数 2
回答已采纳
1回答
我试图使用CSS3创建以下效果(仅针对Chrome )。本质上，我想要一个编号的<ol>元素，它包含一个单选按钮和一个标签。其目的是获取列表号、收音机和标签，以便在中心对齐：
这是我的标记：
<ol>
<li>
<div class="wrapper">
<div class="left">
<input type="radio" />
</div>
浏览 2提问于2014-05-19得票数 4
回答已采纳
2回答
我有一个在HTML页面中使用子选择器的CSS样式，如下所示：
<html>
<head>
<title>MSO Bug</title>
<style type="text/css" media="screen,print">
ol{list-style-type:decimal;}
ol > ol {list-style-type:lower-alpha;}
ol > ol &g
浏览 0提问于2010-05-12得票数 5
回答已采纳
1回答
我创建了一个项目，显示用户的名字和姓氏，如果用户转到"/users“，则显示电子邮件。它工作得很好，但问题是当我试图显示数据时，我在有序列表中得到了相同的数字。有关详细信息，请参阅图像。
下面是HTML文件的代码...如何解决此问题？
<!DOCTYPE html>
{% load static %}
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>User Page</ti
浏览 4提问于2020-03-14得票数 0
11回答
<ol>
<li>test</li>
<li>test</li>
</ol>
将显示为：
测试
测试
我想要彩色的数字和黑色的文本！
我可以编辑css，但是我没有访问HTML的权限。
浏览 19提问于2009-01-28得票数 63
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
云直播活动推荐
腾讯云开发者
