如何在HTML中自定义font-size属性并传递至CSS（无类/样式标签）

为什么你的代码没生效？ #

• 你用了h1::after伪元素，它是给h1后面追加额外内容的，不是修改h1本身的字体大小，所以原标题文字不会有变化。
• 非content属性使用attr()时，必须明确指定值的类型和默认值，浏览器才能正确解析带单位的长度值（比如rem）。

正确实现代码 #

HTML #

<h1 fsize="4rem">TEST</h1>

CSS #

h1 {
    font-size: attr(fsize length, 1rem);
}

• length用来告诉浏览器该属性值是长度单位，1rem是当fsize属性不存在时的默认字体大小。

更规范的写法（推荐） #

使用HTML标准的data-*自定义属性，避免和未来可能新增的原生HTML属性冲突：

HTML #

<h1 data-fsize="4rem">TEST</h1>

CSS #

h1 {
    font-size: attr(data-fsize length, 1rem);
}

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