Html 自定义CSS属性是否使用一个前导破折号或两个前导破折号？

或

我在网上的例子中看到了上述两种方法。这两者有什么区别

尝试访问JavaScript中的自定义属性将返回null

#elem {
  --myCustom: 99;
}

#元素{
-我的习惯：99；
}
一些文本
elem=document.getElementById（“elem”）；
style=window.getComputedStyle（elem）；
value=style.getPropertyValue（'-myCustom'）；
警报（值）；

自定义属性按惯例使用一个破折号，后跟渲染器/软件

例如：

-网箱阴影

-莫兹盒阴影

但似乎有一个新功能实现了两个破折号，这可能会让您感兴趣：

• 单个前导破折号用于供应商前缀
• 双前导破折号用于定义

自定义属性是名称以两个破折号开头的任何属性 （U+002D连字符减号），如

--foo

。

生产对应于此：它被定义为任何有效标识符 这是从两个破折号开始的

W3C的一个例子：

：根目录{
--主色：#06c；
--强调颜色：#006；
}
/*CSS文件的其余部分*/
#富h1{
颜色：var（--主色）；
}

---

值得注意的是，CSS变量是在Firefox31和更新版本中实现的。

注意：CSS变量只在Firefox31中起作用+ — 它们是从铬合金中取出的。不在Safari和IE工作：）6年半的时间会有多大的不同。。。CSS变量现在被包括Chrome、Edge和Safari在内的所有主流浏览器所支持（IE或Opera Mini不支持）：嘿，我刚刚读了同一篇文章，但是除了null之外，JavaScript不能返回任何值。WTF？我还没有完全阅读这篇文章，maybee你可以发布一个片段吗？你在HTML中实现了一个具有该id的元素吗？我们已经了解到自定义属性是从两个斜杠开始的。那么把它改成myCustom怎么样？否则。。。我明天会看一看，然后完全按照我的想法来尝试。然而，它仍然返回null，考虑到网上有这么多的例子表明它是有效的，这非常奇怪。还尝试了FF31和Ch。仍然为空。谢谢你的帮助！我非常期待您对此发表进一步的评论。我确信

-myCustom:99无效，它将被（大多数）web浏览器忽略。（我也确信它与任何类型的浏览器黑客无关）。@HashemQolami从技术上讲，浏览器应该忽略它，因为它是一个自定义属性，但即使是自定义属性也应该可以通过getComputedStyle（）访问。实际上，它是一个无效属性（自定义属性，现在有特殊含义）。但是我不确定JavaScript是否可以访问。
#elem {
  --myCustom: 99;
}

#elem {
-myCustom: 99;
}

<div id="elem">some text</div>

elem = document.getElementById("elem");
style= window.getComputedStyle(elem);
value = style.getPropertyValue('-myCustom');
alert(value);