#elem {
-myCustom: 99;
}
要么
#elem {
--myCustom: 99;
}
我已经在网上看到了以上两个例子.两者有什么区别？
尝试在JavaScript中访问自定义属性返回null ..
#elem {
-myCustom: 99;
}
<div id="elem">some text</div>
elem = document.getElementById("elem");
style= window.getComputedStyle(elem);
value = style.getPropertyValue('-myCustom');
alert(value);
解决方法
>单个前导短划线用于供应商前缀
>双前导短划线用于定义 custom properties.
>双前导短划线用于定义 custom properties.
07001@H_404_22@
A custom property is any property whose name starts with two dashes
(U+002D HYPHEN-MINUS),like--foo. The<custom-property-name>
production corresponds to this: it’s defined as any valid identifier
that starts with two dashes.
W3C的一个例子：
:root {
--main-color: #06c;
--accent-color: #006;
}
/* The rest of the CSS file */
#foo h1 {
color: var(--main-color);
}
值得注意的是,CSS变量是在Firefox 31及更新版本中实现的.
