ホームページ > ウェブフロントエンド > CSSチュートリアル > jsがCSSスタイルを変更する方法

jsがCSSスタイルを変更する方法

coldplay.xixi
リリース: 2023-01-05 16:09:13
オリジナル
4435 人が閲覧しました

js で CSS スタイルを変更する方法: 1. cssText メソッドを使用します; 2. [setProperty()] メソッドを使用します; 3. css 属性に対応する style 属性を使用します。

jsがCSSスタイルを変更する方法

このチュートリアルの動作環境: Windows7 システム、css3 バージョン、DELL G3 コンピューター。

CSS スタイルを変更する JS メソッド:

最初のもの: cssText を使用します

div.style.cssText='width:600px;height:250px;border:1px red solid;text-align: center;line-height: 250px;';
ログイン後にコピー

2 つ目: setProperty()

 div.style.setProperty('width','700px');
 div.style.setProperty('height','300px');
 div.style.setProperty('line-height','300px');
 div.style.setProperty('background','#f00');
 div.style.setProperty('color','#fff');
 div.style.setProperty('border','1px solid blue');
 div.style.setProperty('text-align','center');
ログイン後にコピー

3 番目の方法: css 属性に対応する style 属性を使用します

 div.style.width = "800px";
 div.style.height = "250px"; 
 div.style.lineHeight = "250px"; 
 div.style.background = "#000";
 div.style.color = "#fff";
 div.style.border = "1px solid #111";
 div.style.textAlign = "center";
ログイン後にコピー

        
这是一个盒子
ログイン後にコピー

推奨される関連チュートリアル: CSS ビデオ チュートリアル

以上がjsがCSSスタイルを変更する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート