HTMLでフォントの色を設定する方法（3つの方法）-フロントエンドQ&A-php.cn

HTMLでフォントの色を設定する方法（3つの方法）

PHPz

リリース： 2023-04-13 14:31:39

オリジナル

65651 人が閲覧しました

HTML は一般的な Web ページマークアップ言語であり、その基本要素にはテキスト、画像、オーディオ、その他の形式が含まれます。その中でも、テキストはページ上で情報を伝えるための基本要素の 1 つであり、フォントや色が異なると、訪問者に異なる視覚体験を提供し、ページの美しさと読みやすさを向上させることができます。

HTML フォントの色の設定は、CSS スタイルシートを通じて実現できます。 CSS スタイルシートは HTML コードとは別に配置できるため、ページレイアウトの柔軟性と保守性が向上します。フォントの色を設定する方法は次のとおりです:

1. インラインスタイルでフォントの色を設定します

style 属性を HTML タグに直接追加し、次に color 属性を style 属性に追加します。例:

<p style="color:red;">这是一段红色的文字</p>

ログイン後にコピー

このうち、カラー属性値には、カラー名、16 進カラー値、RGB カラー値、HSL カラー値を指定できます。一般的に使用される色の名前には、赤、緑、青、黒、白などが含まれます。一般的に使用されるカラーテーブルを見てみましょう:

#青#0000FF ##2. 内部スタイルシートでフォントカラーを設定します

カラー名	カラー値
ブラック	#000000
ホワイト	#FFFFFF
シルバー	#C0C0C0
グレー	#808080
レッド	##FF0000
緑	#008000

##HTML文書のhead部分にstyleタグを追加し、設定が必要な要素とcolor属性値を定義しますスタイルタグ内。例:

<head>
  <style>
    p{
      color: blue;
    }
  </style>
</head>
<body>
  <p>这是一段蓝色的文字</p>
</body>

ログイン後にコピー

このようにして、本文で定義されたすべての p 要素は、スタイルシート p{} の color 属性を自動的に適用し、青に設定します。このようにして、複数の要素の色をバッチで設定できます。

3. フォントの色を設定する外部スタイルシート

独立したスタイルシートファイルを作成し、色を付ける必要がある要素をクラス名として定義し、HTML内でスタイルシートファイルをリンクします。書類。例:

スタイルシートファイル style.css でクラス名を定義します:

.title{
  color: red;
}

ログイン後にコピー

このスタイルシートを HTML ドキュメントに導入します:

<head>
  <link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
  <h1 class="title">这是一段红色的标题</h1>
</body>

ログイン後にコピー

このように、 HTML ドキュメントのタイトル class="title" を h1 要素に追加すると、スタイルシートの color 属性が自動的に適用され、赤に設定されます。

要約すると、HTML フォントの色を設定するにはさまざまな方法があり、使用する具体的な方法はページのニーズや個人の好みによって異なります。ただし、どの方法を使用する場合でも、合理的なマッチングと明確な分業を実現するために、ページ全体の美しさと読みやすさを考慮する必要があります。この記事が読者のお役に立てば幸いです。

以上がHTMLでフォントの色を設定する方法（3つの方法）の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。