JavaScriptを使用して動的に更新されるスタイルの「属性」を使用して利用できない、CSSで「のみ」実行できることを知りたいです。これまでのところ私は知っています:
- メディアクエリ
- 疑似タグ
もう?
アップデート:
この質問は閉じられましたが、プロジェクトに使用するテクノロジーを決定しようとしているので質問しましたが、オプションの1つはCSSスタイルシートを使用できず、javascriptを使用してのみスタイル属性を操作できます。
width: 10px
インラインスタイル属性には、プロパティ宣言(または)のみを含めることができますcolor: red
。他のCSS構造を含めることはできません。セレクター、at-rules(たとえば、、@import
)など@media
ではありません@font-face
。プロパティ宣言だけです。
ただし、これらはカスケードで大きな役割を果たします。その属性を持つ要素のスタイルはすべて、(!important
もちろん考慮した後)最も優先されます。
ちなみに、実際にはスタイル属性専用のモジュール全体がありますが、作成者にとっては必須の読み物ではありません。
したがって、CSS宣言ではないものはすべて、スタイル属性ではなく、スタイルシートでのみ可能です。それがあなたが求めているものかどうかわからない...
メディアクエリと@media
ルールは同じものではないことに注意してください。メディアクエリは、HTMLの属性など、スタイルシートの外側の領域にも存在する可能性があり、media
次に最も一般的に検出されます。
疑似クラス(:hover
など)と疑似要素(:after
、:before
)は、DOMの一部ではないため、JS(つまりスタイルプロパティ)を介して追加/操作することはできないと思います。