Question

在HTML / CSS中，是否可以按以下格式订购我的有序列表？

nvarchar

更一般地说，是否可以为有序列表创建自己的格式？

Answer 1

当然，您只需添加类型即可将<ol>标记用于罗马数字。

<ol type="i">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ol>

此HTML吐出：

i. Coffee
ii. Tea
iii. Milk

可在此处找到更多信息：http://www.w3schools.com/tags/att_ol_type.asp

对于你o作为第一个位置项，在第二个项目开始计数，并使用Javascript或jQuery前置第一个项目。

Answer 2

所以你想要的是一个任意风格的第一个元素。然后，所有后续列表项应具有一个数字文本，该文本比它们的自然顺序所暗示的低一个。正确的吗？

因此，您的HTML列表只是：

<ol>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
  <li>Item 4</li>
</ol>

以下CSS实现了真正的魔力。然而（小的缺点），我认为你需要明确地设置:before伪元素的宽度，以便类似于＆＃34;普通＆＃34;的外观。列表。

ol {
  list-style-type: none;
}

li {
  counter-increment: strangecounter;
}

li:before {
  content: counter(strangecounter, lower-roman) ". ";
  display: inline-block;
  width: 2em;
  text-align: right;
  margin-right: 0.5em;
}

ol :first-child {
  counter-reset: strangecounter -1;
}

ol :first-child:before {
  content: "o. ";
}

HTML有序列表 - 特定订单

2 个答案: