如何刪除 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中文網其他相關文章！