ホームページ > 記事 > ウェブフロントエンド > HTMLでWebページの色を変更する方法
HTMLでWebページの色を変更する方法
- PHPzオリジナル
- 2023-04-13 10:46:204628ブラウズ
HTML は Web 開発の最も基本的な部分であり、Web ページの色の選択も非常に重要です。 HTML には、ページの背景色、テキストの色、リンクの色の変更など、Web ページの色を変更する方法がいくつか用意されています。
1. Web ページの背景色
- 色の名前を使用する
HTML には、赤、青、緑、その他の一般的な色など、137 の色の名前が用意されています。 。 body タグに style 属性を追加し、background-color 属性を使用し、属性値として色の名前を使用して背景色を変更します。
<body style="background-color: red;">
- 16 進数のカラー値の使用
色の名前に加えて、16 進数のカラー値を使用して背景色を変更することもできます。 body タグに style 属性を追加し、background-color 属性を使用し、属性値として color 値を使用します。
<body style="background-color: #FF0000;">
2. 文字色
- 色の名前を使用
文字の色は色名を使用して変更することもできます。色を変更したいタグにstyle属性を追加し、color属性を使用し、属性値として色の名前を使用します。
<p style="color: green;">这是一个绿色的段落</p>
- 16 進数のカラー値の使用
同様に、テキストの色も 16 進数のカラー値を使用して変更できます。色を変更したいタグにstyle属性を追加し、color属性を使用し、属性値としてcolor値を使用します。
<p style="color: #00FF00;">这是一个绿色的段落</p>
3. リンクの色
- 訪問していないときのリンクの色を変更します
style 属性を a タグに追加します。 color 属性を指定し、色を変更します。 属性値として、名前または色の値を使用できます。マウスがホバーしているときにリンクの色を変更したい場合は、:hover 疑似クラスを使用できます。
<a href="#" style="color: red;">未访问链接</a>
<a href="#" style="color: #FF0000;">未访问链接</a>
<a href="#" style="color: red;">鼠标悬停链接</a>:hover { color: blue; }
<a href="#" style="color: #FF0000;">鼠标悬停链接</a>:hover { color: #0000FF; }
- リンクが訪問されたときに色を変更する
a:visited 疑似クラスに style 属性を追加し、color 属性を使用し、color を使用します。属性値として名前または色の値を指定するだけです。
a:visited { color: gray; }
a:visited { color: #808080; }
概要
上記は HTML で色を変更する基本的な方法です。色の名前または RGB 16 進数値を選択することで、Web ページに独自のスタイルを表示できます。実際の開発では、CSS を使用して Web ページの色をより柔軟に制御することもできます。この記事が初心者の方に役立つことを願っています。
以上がHTMLでWebページの色を変更する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。