の フォントの太さ CSS のプロパティは、フォントの太さまたは太さを設定するために使用されます。テキスト内の文字の細さや太さを指定します。の フォントの太さ プロパティは、ブラウザによって指定されたウェイト、またはフォント ファミリ内の利用可能なフォント フェイスのいずれかに依存します。この CSS プロパティは、細い文字から太い文字までを定義します。

事前定義された数値またはキーワード値を受け入れます。このプロパティで使用できるキーワードは次のとおりです。 ノーマル、ボールド、ライト、そしてボールド 。数値は 100、200、300、......、最大 900 です。数値が大きいほど、数値が小さい場合よりもフォントの太さが太くなります。

単純なJavaプログラム

構文

 font-weight: normal | bold | bolder | lighter | number | initial | inherit; 

の 番号 上記の構文の は数値を表します。数値 400 キーワード値と同じです 普通 、および値 700 キーワード値と同じです 大胆な 。

の 普通 Strong> 値は通常の文字を定義し、 大胆な value は太い文字を指定します。の より大胆な 値は太字のフォントの太さを表し、 ライター value は、親から継承されたフォントのウェイトよりも軽いフォントのウェイトを表します。

CSSで文字を太字にする方法を図解を使って見てみましょう。

導入

CSS は、Web ページ開発のための強力なツールとして知られています。これを利用すると、HTML コンテンツをさまざまな方法でスタイル設定できます。 Web ページのスタイル設定の最も一般的なプロパティの 1 つは、font-weight プロパティを使用することです。太字のテキストを使用すると、重要な情報と視覚的なコントラストを強調でき、コンテンツの読みやすさも向上します。

Font-Weight プロパティを理解する

CSS には、フォントの太さまたは太さを定義するために使用される Font-Weight プロパティがあります。また、テキストの太さまたは明るさの程度も決定され、値が大きいほどフォントの太さが太くなります。 font-weight プロパティは、数値やキーワード値などのさまざまな値を受け入れます。

数値の範囲は 100 から 900 までで、100 ずつ増加します。たとえば、フォントの太さの値を 400 とすると、それは標準であり、フォントの太さの値が 700 の場合は太字とみなされます。ボールド、ボールド、ライト、および一般的に使用されるキーワードの値。

CSS を使用して太字のテキストを作成する方法

CSS を使用して HTML で太字テキストを作成できます。インライン、内部、または外部のフォント スタイル プロパティを使用できます。

1. インライン スタイルを使用して太字テキストを作成する方法

インライン スタイルを利用すると、font-weight プロパティを特定の HTML 要素に直接使用できます。例を挙げてみましょう。

HTMLコード:

 Document <p>Welcome to javaTpoint</p> <p>This is a bold text</p> 

出力

説明：

上記のコードでは、インライン CSS を使用し、font-weight プロパティを太字として適用しました。

Javaのランダム値ジェネレーター

2. 内部スタイルを使用して太字テキストを作成する方法

ここでは、headタグ内にstyleタグを使ってCSSプロパティを記述する必要があります。例を挙げてみましょう:

HTMLコード:

 Document p { font-weight: bold; } <p>Welcome to javaTpoint</p> <p>This is a bold text</p> 

出力

説明：

上記のコードでは、内部 CSS を使用し、font-weight プロパティを適用しました。

3. 外部スタイルを使用して太字テキストを作成する方法

ここでは、外部 CSS ファイルを作成し、それを HTML ファイルにリンクする必要があります。その CSS ファイル内に、スタイル プロパティを記述する必要があります。例を挙げてみましょう。

HTMLコード:

Javaクラス図

 Document <p>Welcome to javaTpoint</p> <p>This is a bold text</p> 

CSSコード:

 p { font-weight: bold; } 

出力

説明：

上記のコードでは、外部 CSS プロパティを使用し、font-weight プロパティを実装しました。

例

以下の例を使用して、さまざまな色合いの太字テキストを作成する方法を見てみましょう。

 p{ font-size: 20px; } <p>This font is normal.</p> <p>This font is bold.</p> <p>This font is lighter.</p> <p>This font is bolder.</p> <p>This font is 100 weight.</p> <p>This font is 200 weight.</p> <p>This font is 300 weight.</p> <p>This font is 400 weight.</p> <p>This font is 500 weight.</p> <p>This font is 600 weight.</p> <p>This font is 700 weight.</p> <p>This font is 800 weight.</p> <p>This font is 900 weight.</p> 

出力