求助：类LaTeX定理环境CSS已配置，HTML代码如何正确编写？

你的CSS逻辑是通过attr(text)读取元素的text属性值来生成定理副标题，但之前的写法是把副标题内容放在div内部，没有设置对应属性，所以无法触发预期效果。

完整CSS（含计数器初始化） #

先确保CSS包含计数器的初始化和递增逻辑，否则定理编号无法正常工作：

body {
  counter-reset: thm; /* 初始化定理计数器 */
}

.thm {
  counter-increment: thm; /* 每次使用thm类，计数器自动加1 */
  font-style: italic; /* 可选：让定理内容斜体，与标题区分 */
  margin: 1em 0;
}

.thm[text]:before {
  content: "Theorem " counter(thm) "(" attr(text) "). ";
  font-weight: bold;
  font-style: normal;
}

正确的HTML代码 #

给div元素添加text属性，将副标题内容作为属性值传入：

<div class="thm" text="prime number">All odd numbers are prime.</div>

渲染后会显示：Theorem 1(prime number). All odd numbers are prime.

如果需要多个定理，直接重复上述结构即可，计数器会自动递增编号：

<div class="thm" text="prime number">All odd numbers are prime.</div>
<div class="thm" text="even composite">All even numbers greater than 2 are composite.</div>

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