CSS
 Computer >> コンピューター >  >> プログラミング >> CSS

CSSでEmを使用してフォントサイズを設定する

CSSでfont-sizeプロパティを設定するには、emを使用できます。これは、テキストのピクセル精度が必要な場合に役立ちます。デフォルトでは、1em =16px、2em=32pxです。

例

<!DOCTYPE html>
<html>
<head>
<style>
.demo {
   text-decoration: overline;
   text-decoration-color: yellow;
   font-size: 1.3em;
}
</style>
</head>
<body>
<h1>Examination Details</h1>
<p class="demo">Exam on 20th December.</p>
<p class="demo2">Exam begins at 9AM.</p>
</body>
</html>

出力

CSSでEmを使用してフォントサイズを設定する

例

別の例を見てみましょう-

<!DOCTYPE html>
<html>
<head>
<style>
div {
   text-align: justify;
   text-justify: inter-word;
   color: white;
   background-color: gray;
   font-size: 1.5em;
}
</style>
</head>
<body>
<h2>Demo Heading</h2>
<div>This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. </div>
</body>
</html>

出力

CSSでEmを使用してフォントサイズを設定する


  1. CSSを使用したキーワードによるフォントサイズの設定

    CSSのfont-sizeプロパティは、絶対キーワードと相対キーワードで設定できます。これにより、テキストが必要に応じて拡大縮小されます。 構文 CSSfont-sizeプロパティの構文は次のとおりです- Selector {    font-size: /*value*/ } 次の表に、CSSで使用される標準キーワードを示します- Sr.No 値と説明 1 中 フォントサイズを中サイズに設定します。これはデフォルトです 2 xx-小さい font-sizeをxx-smallサイズに設定します 3 x-small

  2. CSSのフォントサイズ

    CSS font-sizeプロパティは、フォントのサイズを設定するために使用されます。値は、パーセンテージ、ピクセル、cm、ポイント、emなどの単位、および絶対キーワードで指定できます。相対値はアクセシビリティを最大化します。デフォルトのフォントサイズは16pxまたは12ptです。 構文 CSSfont-sizeプロパティの構文は次のとおりです- Selector {    font-size: /*value*/ } 次の例は、CSSのfont-sizeプロパティ-を示しています。 例 <!DOCTYPE html> <html> <he