html - HTML/CSS - 无法选择的行号

Question

我想在一个块中显示一些代码，并包含行号。如何获得显示的行号，不能选择，不依赖 Javascript？

Pastebin.com 似乎能够做到这一点，但我不太清楚如何做到这一点。有任何想法吗？

提前致谢！

Answer 1

Pastebin 通过将每一行内容添加为有序列表中的 LI 元素来解决此问题。

<ol>
  <li>public void foo() {</li>
  <li>  System.out.println("bar");</li>
  <li>}</li>
</ol>

选择时不会复制此类列表中的数字：

1. 公共无效 foo() {
2. System.out.println("bar");
3. }

其余的是使用 css 进行样式设置。

Answer 2

在 pastebin.com 的例子中，他们只使用 HTML 中的有序列表，生成行编号列表。您不能在 HTML 中选择列表项编号或项目符号...</p>

Answer 3

这很简单ol > li（每一行都是一个有序的列表项）。