プロパティ cssText
プロパティ cssText を使用すると、
CSS スタイルを一括して1行で設定できます。これにより、
属性 style
の内容全体が上書きされます。
構文
要素.style.cssText = 'プロパティ1: 値; プロパティ2: 値...'
例
要素に複数のスタイルを設定してみましょう:
<p id="elem"></p>
let elem = document.querySelector('#elem');
elem.style.cssText = 'color: red; font-size: 40px;';
例
この例では、要素には最初から
属性 style にスタイルが
すでにありますが、プロパティ cssText はそれを上書きします:
<p id="elem" style="background: red;"></p>
let elem = document.querySelector('#elem');
elem.style.cssText = 'color: red; font-size: 20px;';
例
以前のスタイルが上書きされないようにするには、 次のようにすることができます:
<p id="elem" style="background: green;"></p>
let elem = document.querySelector('#elem');
elem.style.cssText += 'color: red; font-size: 20px;';
関連項目
-
メソッド
getComputedStyle,
これは要素のCSSプロパティ値を取得します