HTMLを使用して、Webページの一部の要素およびコンテンツの一部の色を変更できます。 たとえば、テキスト、境界線、またはHTMLコンテンツ分割のチュートリアルで示されているように-の色を変更できます。 <div> エレメント。 これらのコンテンツの色の値を変更する方法は、要素ごとに異なります。

このチュートリアルでは、テキストの色、画像の境界線、および <div> HTMLカラー名を使用する要素。

などのテキスト要素の色 <p> また <h1>、を使用して変更されます style 属性と color そのようなプロパティ:

<p style="color:blue;">This is blue text.</p>

あなたのでこのコードを書いてみてください index.html ファイルを作成し、ブラウザにロードします。 (チュートリアルシリーズに従わなかった場合は、セットアップ手順を確認できます。 index.html チュートリアルHTMLプロジェクトの設定のファイル。 ブラウザにファイルをロードする手順については、チュートリアルはこちらを参照してください。)

次のようなものを受け取るはずです。

これは青いテキストです。

境界線の色は、を使用して変更されます style 属性と border 財産:

<img src="https://html.sammy-codes.com/images/small-profile.jpeg" style="border: 10px solid green"/>

あなたのでこのコードを書いてみてください index.html ファイルを作成し、ブラウザにロードします。 (この例では、オンラインでホストしているイメージを使用していることに注意してください。 また、境界線は幅が10ピクセルで、実線(破線ではなく)である必要があることも指定しました。

次のようなものを受け取るはずです。

の色 <div> コンテナは、を使用して変更されます style 属性と background-color そのようなプロパティ:

<div style="width:200px;height:200px;background-color:yellow;"></div>

あなたのでこのコードを書いてみてください index.html ファイルを作成し、ブラウザにロードします。 次のようなものを受け取るはずです。

これらの例では、色の値は色の名前で定義されています。 テキスト、画像の境界線の色を変更してみてください <div> 次の色の名前を使用する要素: black, white, gray, silver, purple, red, fuchsia, lime, olive, green, yellow, teal, navy, blue, maroon、 と aqua.

色は16進値で指定することもできることに注意してください。 16進数の色は、次のようなポンド記号が前に付いた6桁の英数字で構成されます。 #0000FF (青い)、 #40E0D0 (ターコイズ)、または #C0C0C0 (銀)。 ただし、このチュートリアルシリーズでは、引き続き色名を使用します。

これで、テキストの色、画像の境界線、および <div> 色名を使用する要素。 チュートリアルシリーズの後半で、Webサイトの構築を開始するときに、色に戻ります。