HTML テキストフォーマットの簡単な例 (詳細な説明)

HTML テキストフォーマットの簡単な例 (詳細な説明)

1. テキストの書式設定: この例では、HTML ファイル内のテキストを書式設定する方法を示します。

XML/HTML コードコンテンツをクリップボードにコピー
  1. <html>​​   
  2.   
  3. <本文>   
  4.   
  5. < b >このテキストは太字です</ b >   
  6.   
  7. < br   />   
  8.   
  9. < strong >このテキストは強いです</ strong >   
  10.   
  11. < br   />   
  12.   
  13. <大きい>このテキストは大きいです</大きい>   
  14.   
  15. < br   />   
  16.   
  17. < em >このテキストは強調されています</ em >   
  18.   
  19. < br   />   
  20.   
  21. < i >このテキストは斜体です</ i >   
  22.   
  23. < br   />   
  24.   
  25. <小>このテキストは小さいです</小>   
  26.   
  27. < br   />   
  28.   
  29. このテキストには
  30. < sub >下付き文字</ sub >   
  31.   
  32. < br   />   
  33.   
  34. このテキストには
  35. < sup >上付き文字</ sup >   
  36.   
  37. </本文>   
  38. </html>​​   

効果は以下のとおりです。

2. フォーマット済みテキスト: この例では、pre タグを使用して空白行とスペースを制御する方法を示します。

XML/HTML コードコンテンツをクリップボードにコピー
  1. <html>​​   
  2.   
  3. <本文>   
  4.   
  5. <前>   
  6. これは
  7. フォーマット済みのテキスト。
  8. スペースを節約する
  9. および改行。
  10. </前へ>   
  11.   
  12. < p > pre タグはコンピュータコードを表示するのに最適です: </ p >   
  13.   
  14. <前>   
  15. i = 1から10 まで
  16. 印刷する
  17. 次に私
  18. </前へ>   
  19.   
  20. </本文>   
  21. </html>​​   

効果は以下のとおりです。

3. 「コンピュータ出力」ラベル: この例では、さまざまな「コンピュータ出力」ラベルの表示効果を示します。

XML/HTML コードコンテンツをクリップボードにコピー
  1. <html>​​   
  2.   
  3. <本文>   
  4.   
  5. < code >コンピュータコード</ code >   
  6. < br   />   
  7. < kbd >キーボード入力</ kbd >   
  8. < br   />   
  9. < tt >テレタイプテキスト</ tt >   
  10. < br   />   
  11. < samp >サンプルテキスト</ samp >   
  12. < br   />   
  13. < var >コンピュータ変数</ var >   
  14. < br   />   
  15.   
  16. < p >   
  17. < b >コメント: </ b >これらのタグは、コンピューター/プログラミング コードを表示するためによく使用されます。
  18. </p>​​   
  19.   
  20. </本文>   
  21. </html>​​   

効果は以下のとおりです。

4. アドレス: この例では、HTML ファイルにアドレスを書き込む方法を示します。

XML/HTML コードコンテンツをクリップボードにコピー
  1. <!DOCTYPE html >   
  2. <html>​​   
  3. <本文>   
  4.   
  5. <住所>   
  6. 著者: < a   href = "mailto:[email protected]" >ドナルドダック</ a > . < br >     
  7. 次のサイトをご覧ください: < br >   
  8. Example.com < br >   
  9. ボックス564、ディズニーランド< br >   
  10. アメリカ合衆国
  11. </アドレス>   
  12.   
  13. </本文>   
  14. </html>​​   

効果は以下のとおりです。

5. 略語と頭字語: この例では、略語または頭字語を実装する方法を示します。

XML/HTML コードコンテンツをクリップボードにコピー
  1. <html>​​   
  2.   
  3. <本文>   
  4.   
  5. <略語  title = "etcetera" >など</ abbr >   
  6. < br   />   
  7. <頭字語 タイトル= "ワールド ワイド ウェブ" > WWW </頭字語>   
  8.   
  9. < p >一部のブラウザでは、タイトルを使用して、略語の上にマウスを移動したときに式の完全版を表示できます。 </p>​​   
  10.   
  11. <p> IE 5の頭字語要素でのみ機能します。 </p>​​   
  12.   
  13. < p > Netscape 6.2 の abbr 要素と acronym 要素の両方に有効です。 </p>​​   
  14.   
  15. </本文>   
  16. </html>​​   

効果は以下のとおりです。

6. テキストの方向: この例では、テキストの方向を変更する方法を示します。

XML/HTML コードコンテンツをクリップボードにコピー
  1. <html>​​   
  2.   
  3. <本文>   
  4.   
  5. < p >   
  6. ブラウザが双方向オーバーライド (bdo) をサポートしている場合、次の行は右から左 (rtl) に出力されます。
  7. </p>​​   
  8.   
  9. <ビード  dir = "rtl" >   
  10. ここにヘブライ語のテキストがあります
  11. </bdo>​​   
  12.   
  13. </本文>   
  14. </html>​​   

効果は以下のとおりです。

7. ブロック引用: この例では、さまざまな長さの引用を実装する方法を示します。

XML/HTML コードコンテンツをクリップボードにコピー
  1. <html>​​   
  2.   
  3. <本文>   
  4.   
  5. ここに長い引用文があります:
  6. <引用>   
  7. これは長い引用です。これは長い引用です。これは長い引用です。これは長い引用です。これは長い引用です。これは長い引用です。これは長い引用です。これは長い引用です。これは長い引用です。これは長い引用です。これは長い引用です。
  8. </引用>   
  9.   
  10. 以下は短い引用です:
  11. < q >   
  12. これは短い引用です。
  13. </q>​​   
  14.   
  15. < p >   
  16. blockquote 要素を使用すると、ブラウザは改行と余白を挿入しますが、 q 要素には特別なレンダリングはありません。
  17. </p>​​   
  18.   
  19. </本文>   
  20. </html>​​   

効果は以下のとおりです。

8. サブエフェクトを削除し、サブエフェクトを挿入します。

XML/HTML コードコンテンツをクリップボードにコピー
  1. <html>​​   
  2.   
  3. <本文>   
  4.   
  5. < p > 1ダースには< del > 20 </ del >あります  < ins > 12 個</ ins >個。 </p>​​   
  6.   
  7. < p >ほとんどのブラウザでは、これをテキストに取り消し線と下線を付ける形式に書き換えます。 </p>​​   
  8.   
  9. < p >一部の古いブラウザでは、取り消し線や下線が引かれたテキストが通常のテキストとして表示されます。 </p>​​   
  10.   
  11. </本文>   
  12. </html>​​   

効果は以下のとおりです。

上記の HTML テキスト フォーマットの簡単な例 (詳細な説明) は、エディターが皆さんと共有する内容のすべてです。参考になれば幸いです。また、123WORDPRESS.COM を応援していただければ幸いです。

<<:  暗号化における https の Apache 展開の概要

>>:  ウェブサイトの画像にグレー効果を加える3つの方法

推薦する

JSはプログレスバーをドラッグして要素の透明度を変更することを実装しています

今日ご紹介したいのは、ネイティブ JS を使用してプログレス バーをドラッグし、要素の透明度を変更す...

MySQL 8.0.20 winx64 のインストールと設定方法のグラフィックチュートリアル

この記事では、MySQL 8.0.20 winx64 のインストールと設定方法を次のように説明します...

Centos7 での NFS サービス構築の紹介

目次1. サーバー2. クライアント3. テストサービス1. サーバー1. YUMソースを使用してN...

インライン要素スパンの最小高さの定義

span タグは HTML ウェブページを作成するときによく使用されますが、このタグの使い方がよくわ...

vue backtop コンポーネントを実装するための完全なコード

効果： コード： <テンプレート> <div class="back-t...

Vueはdivホイールのズームインとズームアウトを実装します

Vue プロジェクトで div ホイールのズームインとズームアウト、ドラッグ効果、キャンバス効果に似...

Vue プロジェクトでの支払い機能の実装 (WeChat 支払いと Alipay 支払い)

目次プロジェクトにおける一般的な支払い方法Alipay決済微信ペイプロジェクトにおける一般的な支払い...

HTML 基本構造_Powernode Java アカデミー

多くの場合、Web ページ開発を学ぶときに最初に印象に残るのは、html または htm サフィック...

MySQL 5.7.15 バージョンのインストールと設定方法のグラフィックチュートリアル

この記事では、MySQLバージョン5.7のインストール方法と使用方法、およびデータベースデータの保存...

Docker のホスト間コンテナ通信オーバーレイ実装プロセスの詳細な説明

サーバーも 2 つあります。準備：コンテナのホスト名を設定する consul: kv タイプのストレ...

ダウンロードにおすすめの氷と雪のフォント 33 種類 (個人用および商用)

01 ウィンターフレーク（個人のみ） 02 スノートップキャップ（業務用） 03 モディウス「フリ...

MySQL における := と = の違いをグラフィカルに紹介

:= と = の違い=設定および更新の場合にのみ、:= と同じ効果、つまり代入効果があり、それ以外の...

Dockerコンテナを使用する簡単な例

目次1. イメージをプルする2. イメージを実行する3. コンテナ内でアプリケーションをテストする4...

MySQL に接続されている IP アドレスを表示する方法の例

具体的な方法：まずコマンドプロンプトを開きます。次に、[ mysql -u root -p ] コマ...

MySQLで時間別データと最後の時間別データの差をクエリするアイデアの詳細な説明

1. はじめに要件は、特定の時間範囲内で、1 時間ごとのデータと前の 1 時間ごとのデータの差と比率...