如何用CSS为Emacs的src块添加行号且复制时不含行号？

步骤1：修改Org文件中的代码块 #

移除src块的-n参数，避免导出时把行号嵌入代码文本：

#+begin_src python -r :results output :exports both
print("Hello")
print("I need line number for these code")
print("But I don't need line number when I copy code")
#+end_src

步骤2：添加正确的CSS样式 #

将以下CSS加入你的Org导出HTML的样式表中：

/* 代码块基础样式 */
pre.src {
  margin-top: 5px;
  margin-bottom: 20px;
  border: #66c 1px solid;
  padding: 0.5em 0.5em 0.5em 3em; /* 左侧预留行号空间 */
  white-space: pre;
  background: #FFF;
  color: black;
  text-align: left;
  position: relative;
  counter-reset: line; /* 重置行号计数器 */
}

/* 每一行代码作为块元素，触发计数器递增 */
pre.src code {
  display: block;
  counter-increment: line;
}

/* 生成行号并设置样式 */
pre.src code::before {
  content: counter(line); /* 显示当前计数器值 */
  position: absolute;
  left: 0.5em;
  color: #999;
  border-right: 1px solid #ddd;
  padding-right: 0.5em;
  text-align: right;
  width: 2em; /* 固定宽度避免行号错位 */
  user-select: none; /* 禁止选中行号，复制时不会包含 */
}

原理说明 #

1. 用counter-reset在代码块容器初始化行号计数器，每一行代码通过counter-increment自动递增行号。
2. 行号通过绝对定位放在代码块左侧，不占用文本流空间，且user-select: none确保复制操作只会选中代码内容，不会包含行号。
3. 移除-n参数后，Org导出的代码文本不再包含行号，彻底避免手动删除的麻烦。

内容的提问来源于stack exchange，提问作者letranger