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

CSSでフォントスタイルを設定する方法｜font-styleプロパティの使い方

CSSのfont-styleプロパティとは

フォントスタイルを設定するには、CSSのfont-styleプロパティを使用します。このプロパティにより、テキストをイタリック体（italic）、標準（normal）、斜体（oblique）のいずれかのスタイルで表示できます。

font-styleで指定できる主な値

  • normal … 標準のスタイルでテキストを表示します。
  • italic … 筆記体を模した傾きのあるイタリック体で表示します。
  • oblique … 通常の書体を単純に傾けた斜体で表示します。

サンプルコード

以下のコードは、CSSでfont-styleをitalicに設定する例です。実際にブラウザで実行して、表示の違いを確認してみてください。

<html>
   <head>
   </head>
   <body>
      <p style = "font-style:italic;">
         ヨーロッパ、オーストラリア、南アメリカは大陸です。
      </p>
   </body>
</html>

このように、対象の要素に対してfont-style: italic;を指定するだけで、簡単にテキストをイタリック体に変更できます。強調したい箇所や引用文などの装飾に活用するとよいでしょう。

  1. CSSのoutline-styleプロパティでアウトラインの線種を設定する方法

    CSSのoutline-styleプロパティは、要素の周囲に表示されるアウトライン（輪郭線）のスタイルを指定するために使用します。アウトラインはborderプロパティと似ていますが、ページのレイアウトや要素のサイズに影響を与えないという点が大きな特徴です。そのため、フォーカス表示や強調などに活用されます。 outline-styleで使える主な値 solid … 実線で表示します dashed … 破線で表示します dotted … 点線で表示します double … 二重線で表示します groove / ridge / inset / outset … 立体的な装飾線で表示します none

  2. CSSのfont-styleプロパティとは？イタリック・斜体の指定方法を解説

    CSSのfont-styleプロパティは、要素のテキストに対して「通常（normal）」「イタリック（italic）」「斜体（oblique）」のいずれかのスタイルを指定するために使用されます。italicはフォント自体が持つ斜めの書体を利用するのに対し、obliqueはテキストを指定した角度で傾けられる点が特徴です。 構文 CSSのfont-styleプロパティの構文は以下のとおりです。 Selector { font-style: /*値*/ } 指定できる主な値 normal … 通常の書体を表示します（初期値）。 italic … フォントのイタリック体（斜めの書体）を表示