我可以在HTML文件中使用CSS自定义属性吗？

问题描述

是否可以将HTML标记内的css自定义属性用于内联svg元素？

说我有一个内嵌svg元素：

<svg style="width:var(--image-width);" />

现在，该语句无效，但是有没有办法在HTML文件中而不是CSS文件中使用--image-width？

解决方法

如果导入定义属性--image-width的css文件，它应该可以工作。

/* style.css */
:root {
    --image-width: 42px;
}

<!-- Your html file -->
<link rel="stylesheet" href="style.css">
<svg style="width: var(--image-width);">
    <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />
</svg>

custom-properties html