HTML 学習第 4 章 (HTML テキストの書式設定タグ)

1.太字

• <b>と<strong> :どちらも太字の効果があり、 <b> にはセマンティクスがなく、 <strong> には強調効果があります (<em> よりも強力です)。太字のタグ <b> の代わりに、通常のタグ <strong> が使用されます。

<b>定义粗体文本</b>
<strong>定义加重语气</strong>

2.斜体

• <i>と<em> : どちらも斜体の効果があり、 <i> には意味的な意味はなく、 <em> には強調の効果があります。通常、<i> タグの代わりに <em> が使用されます。

<i>定义斜体字</i>
<em>定义着重文字</em>

3. 上付き文字と下付き文字

• <sup> :上付きの単語を定義します; <sub> :下付きの単語を定義します。

<sup>定义上标字</sup>
<sub>定义下标字</sub>

4. テキストを削除する

• <del> : 削除されたテキストに取り消し線を追加します。

<del>被删除的文本</del>

5. 小さなフォント

• <small> : フォントのフォントサイズを小さく変更します。

<small>定义小号字</small>

6. テキストを挿入する

• <ins> : 下線付きの挿入単語を定義します。

<ins>定义插入文本</ins>

7.HTML「コンピュータ出力」タグ

• <code> : ドキュメント内のテキストをフォーマットするためのコンピューター コードを定義します。

<p>你好呀<code>Hello World</code></p>

• <pre> : フォーマット済みテキストを定義します。pre 要素で囲まれたテキストは通常​​、スペースと改行を保持し、テキストは固定幅フォントで表示されます。一般的なアプリケーション: コンピューターのソース コードを表すために使用されます。

<pre>
  使用pre标签
  对空行和    空格
  展示与控制
</pre>

<pre>
  pre标签很适合显示程序代码:
  let arr = [1, 2, 3]
  for (let index = 0; index < arr.length; index++) {
    const item = arr[index];
    console.log(item);
  }
</pre>

• <kbd> : キーボード コードを定義し、ドキュメント内のテキストの書式を設定します。

<p>键入<kbd>refresh</kbd>刷新页面。</p>

• <samp> : コンピュータ プログラムのサンプル テキストを定義するために使用されるフレーズ タグ。

<p>定义<samp>计算机样本</samp></p>

• <var> : ドキュメント内のテキストをフォーマットするための変数を定義します。

<p>定义<var>变量</var></p>

8.HTMLの引用、引用、およびタグの定義

• <abbr> : 略語を定義します。マウスを置くとフルネームが表示されます。コメントにも使用できます。

<p>我在学习<abbr title="Hyper Text Markup Language">HTML</abbr></p>

• <address> : アドレスを定義し、タグはドキュメントの作成者/所有者の連絡先情報を定義します。要素のテキストは通常​​、斜体で表示され、要素の前後で自動的に行が折り返されます。

<div>
  欢迎联系我
  <address>我的邮箱是：<br />[email protected]</address>
  谢谢！
</div>

• <bdo> : テキストの方向を定義し、デフォルトのテキストの方向をオーバーライドします。方向を制御する dir 属性: ltr (左から右): デフォルト、左から右; rtl (右から左): 右から左。

<p><bdo dir="ltr">该段落文字从左到右显示。</bdo></p>
<p><bdo dir="rtl">该段落文字从右到左显示。</bdo></p>

• <blockquote> : 別のソースから取得したブロック引用 (段落引用) を定義します。<q> との違い: ブロック レベルの要素。デフォルトで左右 40 ピクセルの外側スペースがあり、"" がなく、フォント スタイルが変更されます。

<div>
  <span>注意：</span>
  <blockquote cite="http://www.abc.org/index.html">
    我是另一个源块文字。
  </blockquote>
</div>

• <q> : 短いテキストへの参照を定義します。<blockquote> との違い: インライン要素は内容の先頭と末尾に "" が付き、フォントは斜体になります。

 <p>注意：<q cite="http://www.abc.org/index.html">我是一段引用文字。</q></p>

• <cite> : 引用、引用を定義し、引用元を示します。

<div>
  <blockquote>
    <pre>
          红豆生南国，春来发几枝。
          愿君多采撷，此物最相思。
     </pre>
  </blockquote>
  <p>摘自：<cite>唐·王维《相思》</cite></p>
</div>

• <dfn> :定義項目。フレーズタグです。

<p>定义<dfn>项目</dfn></p>

注: 各タグには意味があります。すべてのタグは、HTML のセマンティック効果をより強調するために使用されます。特定の視覚効果を実現するためにのみこのタグを使用する場合は、CSS を使用することをお勧めします。