ホームページ > ウェブフロントエンド > htmlチュートリアル > HTMLでフォントの色を変更する方法

HTMLでフォントの色を変更する方法

醉折花枝作酒筹
リリース: 2021-04-14 09:35:11
オリジナル
10765 人が閲覧しました

方法: 1. HTML タグの style 属性を「」という構文で使用します。 2. 「color:color」のスタイルをstyle タグ; 3. font タグの color 属性によって設定され、構文は "" です。

HTMLでフォントの色を変更する方法

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

HTML は主にページ レイアウトを記述するために使用されます。その過程で、ページ上の特定のフォントの色を設定することが必要になることがよくあります。設定をカスタマイズするには、通常 3 つの一般的な方法があります:

1. 外部 CSS スタイルを介して設定します。 head タグにスタイルを追加し、本文内の他のタグ (h1、p、div など) に class="上記のスタイルで定義された名前 (blue など) を追加してタグを開始できます。 。コードは次のように実装されます:

HTMLでフォントの色を変更する方法

#2. 内部 CSS スタイルを通じて設定します。 h1、p、div、その他の開始タグなど、本文内の他のタグには、style="color:white;font-size:25px;" を追加するだけです。コードは次のように実装されます:

HTMLでフォントの色を変更する方法

3. font タグを通じて設定します。 本文の他のタグ コンテンツに、color=" yellow" size="5" など、フォントの色とサイズを設定する font タグを追加します。サイズの最大値は 7 で、フォントの色とサイズは等号を使用して割り当てられ、最初の 2 つの CSS スタイルは英語のコロンを使用して割り当てられることに注意してください。コードは次のように実装されます。

HTMLでフォントの色を変更する方法

拡張情報

HTML Web ページのフォント サイズを定義するには、px、em、という 3 つの一般的な単位があります。そしてpt。

1. Px はピクセルの略で、ピクセルに基づく単位であり、Web を閲覧する過程で、画面上の文字や写真などが画面の解像度に応じて変化します。幅 100 ピクセルの画像は、800×600 の解像度では画面幅の 1/8 を占めますが、1024×768 では約 1/10 しか占めません。したがって、フォントサイズを定義するときにピクセルを単位として使用すると、ユーザーが表示解像度を 800 から 1024 に変更すると、ユーザーが実際に見る文字が「小さく」(自然長単位)なり、不鮮明になる場合があります。 、ブラウズに影響します。

2. Em は % であり、相対単位であり、長さの相対単位でもあります。もともとは文字 M の幅を指していたため、em という名前が付けられました。現在は文字幅の倍数を指し、その使用法は 0.8em、1.2em、2em などのパーセンテージに似ています。通常は 1em=16px です。 , 一般に長さを測定するために使用される汎用単位 (要素の余白やパディングなど)。フォント サイズの指定に使用される場合、em 単位は親要素のフォント サイズを指します。

3. pt はポイント (ポンド) の略で、1/72 インチの大きさの固定長さの測定単位です。 Web 上のテキストの単位として pt を使用すると、異なる画面でフォント サイズが同じ (同じ解像度) になり、組版に影響が出る可能性がありますが、Word で pt を使用すると非常に便利です。 Wordを使用する主な目的は画面閲覧ではなく、出力・印刷だからです。エンティティに印刷する場合、pt は自然な長さの単位として便利で実用的です。たとえば、Word の通常の文書では「Song font 9pt」が使用され、タイトルでは「Helvetica 16pt」が使用されます。コンピュータの設定に関係なく、pt は使用されます。印刷するときは常にこの大きさになります。

推奨学習: html ビデオ チュートリアル

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

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