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

HTMLのiタグとは？使い方とサンプルコードをわかりやすく解説

HTMLの<i>タグは、テキストの一部をイタリック体（斜体）で表示するための要素です。ただし、<i>タグの使用は、<em>・<strong>・<mark>といった意味論的（セマンティック）な要素が適さない場合に限定して検討すべきとされています。

<i>タグの役割と使い分けのポイント

<i>タグは見た目上、文字を斜体にしますが、「重要性」や「強調」という意味合いは持ちません。そのため、文章の強調を意図している場合には<em>や<strong>を使用し、<i>タグは専門用語、外来語、作品名など、周囲のテキストと性質の異なる部分を示すときに使うのが適切です。

それでは、実際に<i>タグを実装した例を見てみましょう。

サンプルコード

<!DOCTYPE html>
<html>
<head>
<title>HTML i tag</title>
</head>
<body>
   <h1>
      Products
   </h1>
   <p>The products includes Clothing, Accessories and Furniture to be delivered by <i>FDX</i> couriers.</p>
</body>
</html>

出力結果

HTMLのiタグとは？使い方とサンプルコードをわかりやすく解説

この例では、<p>タグの中に以下のようにコンテンツを記述しています。

<p>The products includes Clothing, Accessories and Furniture to be delivered by <i>FDX</i> couriers.</p>

ここで設定している<i>タグの部分が、次のコードです。

<i>FDX</i>

このように<i>タグで囲まれた「FDX」の部分は斜体で表示され、配送業者名であることが視覚的に区別できるようになります。意味を持たない単純なスタイル指定ではなく、用途に応じて適切な要素を選ぶことが、読みやすく保守しやすいHTMLを作成するポイントです。

  1. HTMLのembedタグとは？使い方と主な属性をわかりやすく解説

    <embed>タグとは<embed>タグは、HTML文書の中に外部アプリケーションやプラグインコンテンツ（PDFファイル、動画、音声など）を埋め込むための要素です。開始タグのみで構成され、基本的に終了タグは不要です。<embed>タグで使用できる主な属性は以下の通りです。height：埋め込むコンテンツの高さをピクセル単位で指定します。src：埋め込む外部ファイルのアドレス（URL）を指定します。type：埋め込みコンテンツのメディアタイプ（MIMEタイプ）を指定します。例：「application/pdf」など。width：埋め込むコンテンツの幅をピクセル

  2. HTMLの<dfn>タグとは？定義用語のマークアップ方法を実例付きで解説

    HTMLの<dfn>タグは、専門用語や略語など「定義の対象となる語」が文書内で最初に登場する箇所を示すための要素です。多くのブラウザでは、<dfn>タグで囲まれた部分は斜体（イタリック体）で表示されます。 それでは、<dfn>タグの具体的な実装例を見ていきましょう。 コード例 <!DOCTYPE html> <html> <body> <h2>MCAの科目一覧</h2> <p><dfn title="Master of Computer Applications"