如何删除 HTML 和 CSS 中有序列表编号后面的句点？

HTML 和 CSS 中的有序列表：删除句点

可以使用 CSS 创建数字后不带句点的有序列表。虽然您可能认为这是不可行的，但让我们探讨一下如何实现这一目标。

要删除句点，请按如下方式设置列表样式：

<code class="css">ol.custom {
  list-style-type: none;
  margin-left: 0;
}</code>

要创建自定义数字，请使用以下命令代码：

<code class="css">ol.custom > li {
  counter-increment: customlistcounter;
}

ol.custom > li:before {
  content: counter(customlistcounter) " ";
  font-weight: bold;
  float: left;
  width: 3em;
}</code>

这将在每个列表项之前显示自定义数字。

请记住，这解决方案依赖于 :before 伪选择器，它可能无法在 IE6 和 IE7 等旧版浏览器中工作。要解决此问题，请使用专门针对这些浏览器的附加 CSS 规则：

<code class="css">ol.custom {
  *list-style-type: decimal; /* targets IE6 and IE7 only */
}</code>

以上是如何删除 HTML 和 CSS 中有序列表编号后面的句点？的详细内容。更多信息请关注PHP中文网其他相关文章！