6 
#elem {
  -myCustom: 99;
}

また

#elem {
  --myCustom: 99;
}

上記の両方がオンラインの例で使用されているのを見ました。2つの違いは何ですか？

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);
4

2 に答える 2

9
  • ベンダー接頭辞には先頭のダッシュが 1 つ使用されます
  • カスタム プロパティの定義には、先頭の二重ダッシュが使用されます。

2 カスタム プロパティの定義: '--*' ファミリーのプロパティ

カスタム プロパティは、名前が 2 つのダッシュ (U+002D HYPHEN-MINUS) で始まるプロパティです--foo。生成はこれ<custom-property-name> に対応します: 2 つのダッシュで始まる任意の有効な識別子として定義されます。

W3C の例:

:root {
  --main-color: #06c;
  --accent-color: #006;
}
/* The rest of the CSS file */
#foo h1 {
  color: var(--main-color);
}

CSS 変数は Firefox 31 以降で実装されていることに注意してください。

于 2014-10-22T20:59:38.437 に答える
0

カスタム プロパティは、慣例により 1 つのダッシュを使用し、その後にレンダラー/ソフトウェアが続きます。

例えば：

-webkit-box-shadow

-moz-box-shadow ...

しかし、2 つのダッシュを実装する新しい機能があるようです。これは興味深いかもしれません。

http://www.broken-links.com/2014/08/28/css-variables-updating-custom-properties-javascript/

于 2014-10-22T20:57:57.603 に答える