HTMLで背景色を設定するにはどうすればよいですか? HTMLの背景カラーコードの詳細な分析
この記事では、HTMLコードとCSSスタイルコードを使用してHTMLの背景色を設定する方法を説明します。また、背景画像を設定する方法についても紹介します。皆さんのお役に立てれば幸いです。今すぐこの記事を見てみましょう
まず、HTML での背景色の設定を見てみましょう:
最初に背景色を設定し、 body タグ 効果を見てみましょう:
<!doctype html> <html> <head> <meta charset="utf-8"> <title>PHP中文网</title> </head> <body bgcolor="black"> 这是PHP中文网 </body> </html>
背景色は黒に設定されています。ブラウザに表示される効果を想像できますか?
はい、何も表示されません。フォントを色に設定して、表示できるかどうかを確認してみましょう:
<body bgcolor="black"> <p>这是<font color="#E41316">PHP中文网</font></p> </body>
それでは、効果を見てみましょう:
はい。あまり分かりにくいですが、フォントに色を追加するとテキストが表示されますが、まだ色が付けられていない単語が 2 つあるため、表示できません。
それでは、テキストの背景を作成する方法を見てみましょう:
<body bgcolor="black"> <p style="background-color: #E12125">这是PHP中文网</p> </body>
現時点では font タグは機能しなくなっているため、ご覧のとおり、背景色を変更するために断固として CSS スタイルを使用します。 CSS スタイルは背景色を設定するだけです。
ブラウザに表示される効果を見てみましょう:
p タグにより、背景が行全体を占めます。この方法では、効果がより明確に見えるので、背景をあまり必要としない場合は、p タグの周囲に div タグを追加して幅を設定する方法だけを説明します。テキストの背景を 1 行に表示しないようにテキストの幅を指定します。これもよく使用される方法の 1 つです。
もちろん、写真を背景画像として使用することもできます。効果の例を見てみましょう。
<!doctype html> <html> <head> <meta charset="utf-8"> <title>PHP中文网</title> </head> <body style="background-image: url(https://img.php.cn/upload/article/000/000/003/5a9675a3b2106284.jpg)"> <p>这是PHP中文网</p> </body> </html>
これは、まだ非常に明らかな効果です。例を見てください:
これは、Web ページ全体の背景として使用されます。背景画像として使用するのに適した見栄えの良い画像が他の場所から見つかります。その画像を右クリックし、画像アドレスのコピーを選択して、この URL に追加します。これも非常に簡単です。以下でさらに練習して、効果が私と同じかどうかを確認してください。
HTML での背景色の設定に関するこの記事はここで終わります。さらに詳しく知りたい場合は、PHP 中国語 Web サイトの HTML 学習マニュアル 列にアクセスして学習してください。ご質問がございましたら、以下にメッセージを残してください。
【編集者のおすすめ】
HTMLの段落要素にスペースを設定するにはどうすればよいですか? HTMLスペースの設定まとめ
HTMLでビッグタグを使うには？ HTMLビッグタグの使用例
以上がHTMLで背景色を設定するにはどうすればよいですか? HTMLの背景カラーコードの詳細な分析の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
ホットAIツール
Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ
AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。
Undress AI Tool
脱衣画像を無料で
Clothoff.io
AI衣類リムーバー
AI Hentai Generator
AIヘンタイを無料で生成します。
人気の記事
ホットツール
メモ帳++7.3.1
使いやすく無料のコードエディター
SublimeText3 中国語版
中国語版、とても使いやすい
ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境
ドリームウィーバー CS6
ビジュアル Web 開発ツール
SublimeText3 Mac版
神レベルのコード編集ソフト（SublimeText3）
ホットトピック
7533
15
1379
52
82
11
21
86
HTMLの表の境界線
Sep 04, 2024 pm 04:49 PM
HTML の表の境界線に関するガイド。ここでは、HTML でのテーブルの境界線の例を示しながら、テーブル境界線を定義する複数の方法について説明します。
HTML 左マージン
Sep 04, 2024 pm 04:48 PM
HTML マージン左のガイド。ここでは、HTML margin-left の概要とその例、およびそのコード実装について説明します。
HTML のネストされたテーブル
Sep 04, 2024 pm 04:49 PM
これは、HTML でのネストされたテーブルのガイドです。ここでは、テーブル内にテーブルを作成する方法をそれぞれの例とともに説明します。
HTML テーブルのレイアウト
Sep 04, 2024 pm 04:54 PM
HTML テーブル レイアウトのガイド。ここでは、HTML テーブル レイアウトの値と例および出力について詳しく説明します。
HTML入力プレースホルダー
Sep 04, 2024 pm 04:54 PM
HTML 入力プレースホルダーのガイド。ここでは、コードと出力とともに HTML 入力プレースホルダーの例について説明します。
HTML 内のテキストの移動
Sep 04, 2024 pm 04:45 PM
HTML でのテキストの移動に関するガイド。ここでは、概要、マーキー タグが構文でどのように機能するか、および実装例について説明します。
HTML の onclick ボタン
Sep 04, 2024 pm 04:49 PM
HTML オンクリック ボタンのガイド。ここでは、それらの紹介、動作、例、およびさまざまなイベントでの onclick イベントについてそれぞれ説明します。
