文章/答案/技术大牛

发布

社区首页 >问答首页 >如何创建具有不同标题的多个html有序列表(编辑)

问如何创建具有不同标题的多个html有序列表(编辑)
EN

Stack Overflow用户

提问于 2016-04-27 02:13:26

回答 2查看 415关注 0票数 0

我想创建一个像下面这样的有序列表。谢谢你的帮助。

我们首先收集下列设备：

设备1:驾驶执照。

设备2:信用卡。

设备3:笔记本电脑。

设备4：.

然后，我们按以下步骤检查汽车：

第一步:检查汽车下面是否有明显的泄漏。使用漏油驾驶可能会导致转向、刹车或散热器失效。

第二步:检查轮胎是否有适当的膨胀和任何明显的损坏或过度磨损的迹象。

第三步:让别人站在你的车后面检查车灯。

第四步：.。

html

css

回答 2

Stack Overflow用户

回答已采纳

发布于 2016-04-27 02:59:29

试试看

ol.step {
  margin-left: 0;
  counter-reset: list 0;
}

ol.step > li {
  list-style: none;
}

ol.step > li:before {
  counter-increment: list;
  content: "Step " counter(list) ": ";
  float: left;
  width: 3.5em;
}

ol.equipment {
  margin-left: 0;
  counter-reset: equipment 0;
}

ol.equipment > li {
  list-style: none;
}

ol.equipment > li:before {
  counter-increment: equipment;
  content: "Equipment " counter(equipment) ": ";
  float: left;
  width: 6em;
}

<h2>List 1</h2>
<ol class="equipment">
  <li>Driver's license.</li>
  <li>Credit card.</li>
  <li>Laptop.</li>
</ol>
<h2>List 2</h2>
<ol class="step">
  <li>I would like to create an ordered list like the one below. I appreciate your help.</li>
  <li>Check under the car for obvious leaks. Driving with leaking fluid may cause failure of the steering, brakes or radiator.</li>
  <li>Check the tires for proper inflation and any obvious damage or signs of excessive wear.</li>
  <li>Ask someone to stand behind your car to check the lights.</li>
</ol>

https://jsfiddle.net/3z7y7vjr/5/

票数 0

Stack Overflow用户

发布于 2016-04-27 02:29:32

你所要做的就是建立这样一个有序的列表：

HTML：

    <ol>
      <li>Step 1: Check under the car for obvious leaks. Driving with leaking fluid may cause failure of the steering, brakes or radiator.</li>
      <li>Step 2: Check the tires for proper inflation and any obvious damage or signs of excessive wear.</li>
      <li>Step 3: Ask someone to stand behind your car to check the lights.</li>
      <li>Step 4: ...</li>
    </ol>

CSS：

ol {
  list-style-type: none;
  }

但是，请确保在CSS中(无论是<head></head>部分中的样式标记还是单独样式表上的样式标记)添加list-style-type: none属性，因为这将删除列表中的数字。

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/36879092

复制

相似问题

问如何创建具有不同标题的多个html有序列表(编辑)
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何创建具有不同标题的多个html有序列表(编辑)EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何创建具有不同标题的多个html有序列表(编辑)
EN