例を通してBRタグとPタグの違いを理解する

例を通してBRタグとPタグの違いを理解する
<br />改行タグの使用<br>改行タグ<br>は終わりのないタグです。HTMLファイル内のどこかに<br>タグが使用されている限り、そのファイルをブラウザで表示したときに、その位置以降のテキストが次の行に表示されます。<br>タグは改行タグです!
ご注意ください!通常のテキスト ファイルでは、キーボードの Enter キーを押すだけで改行できます。ただし、HTML ファイルでは Enter キーを押しても意味がありません。改行するには、特定のタグ <br> を使用する必要があります。例:
引用内容は以下のとおりです。
<html>
<ヘッド>
<title>br タグの使用</title>
</head>
<本文>
チンピン・ディアオ<br>
雲は衣服のよう、花は顔のよう、
春風が玄関を吹き抜け、花々が満開です。
もし玉山の頂上で会っていなかったら、
私たちは月の下で瑶台で会います。 <br>
</本文>
</html>
どんな効果が出るかお楽しみに〜!
詩全体をページの中央に配置するにはどうしたらよいかと尋ねる人もいるかもしれません。中央揃えを実現したい場合は、前に学習した <p align=center>content</p> を使用できます。
例:
引用内容は以下のとおりです。
<html>
<ヘッド>
<title>br タグの使用</title>
</head>
<本文>
<p align=center>チンピン・ディアオ<br>
雲は衣服のよう、花は顔のよう、
春風が玄関を吹き抜け、花々が満開です。
もし玉山の頂上で会っていなかったら、
私たちは月の下で瑶台で会います。 <br>
</p>
</本文>
</html>
================================================
段落タグ <p> の使用 <p> タグで識別されるテキストは、同じ段落のテキストを表します。ブラウザでは、改行に加えて、異なる段落のテキストを区別するために、空白行で異なる段落のテキストが区切られることがあります。構文は次のとおりです。
<p>テキスト</p>
しかし、一般的なアプリケーションでは、段落に分割されるテキストの後にのみ <p> タグが追加されることがよくあります。例:
引用内容は以下のとおりです。
<html>
<ヘッド>
</head>
<title><p>タグの使用</title>
</head>
<本文>
チンピン・ディアオ
雲は服に似ており、花は顔に似ている。
春風が敷居を吹き抜け、露が濃い。
もし玉山の頂上でそれを見ていなかったら、
我々は月の下で瑶台で会うだろう、
</本文>
</html>
では、<br> と <p> の違いは何でしょうか?簡単に言えば、枝分かれすると列に分かれる
<p>行間が比較的広いです!以下を見てみましょう:
引用内容は以下のとおりです。
<html>
<ヘッド>
</head>
<title><p>タグの使用</title>
</head>
<本文>
チンピン・ディアオ<br>
雲は衣服のよう、花は顔のよう、
春風が敷居を吹き抜け、露が濃い。
もし玉山の頂上でそれを見ていなかったら、
我々は月の下で瑶台で会うだろう、
</本文>
</html>
こうすると効果がわかりますよね?

<<:  フロントエンドはJavaScriptを通じてCADグラフィックスの詳細を作成および変更します。

>>:  YUMを使用してdockerをインストールする方法

推薦する

Windows システムに MySQL を素早くインストールして展開する方法 (グリーンの無料インストール バージョン)

まずは緑色の無料インストール版のMySQLをダウンロードします。任意のフォルダに入れて構いません。今...

Mac インストール mysqlclient プロセス分析

仮想環境で pip 経由でインストールしてみてください: pip で mysqlclient をイン...

MySQLのREDOログ(リドゥログ)とロールバックログ(アンドゥログ)の詳しい説明

序文:前回の記事では、MySQL システムでよく使用されるログをいくつか説明しました。実は、トランザ...

MySQL 5.7を完全にアンインストールするための詳細な手順

この記事は主に、MySQLを再インストールする際のクリーンでないアンインストールのさまざまな問題をま...

Vue の新しい組み込みコンポーネントの使用方法の詳細な説明

目次1. テレポート1.1 テレポートの紹介1.2 テレポートの使用1.3 プレビュー効果2. サス...

Centos7にTenda U12ワイヤレスネットワークカードドライバーをインストールする際の問題を解決する

解決プロセス:方法1: CentOS7.3 のデフォルトのカーネル バージョンは低く、3.10.0-...

Ubuntu の Docker で mysql5.6 をインストールする方法

1. mysql5.6をインストールする docker 実行 mysql:5.6すべてのアイテムのダ...

Nginx の realip モジュールの使い方の基礎学習

序文nginx モジュールには、公式とサードパーティの 2 種類があります。nginx のインストー...

Docker データ ストレージ ボリュームの詳細な説明

デフォルトでは、コンテナ データの読み取りと書き込みはコンテナのストレージ レイヤーで行われます。コ...

優れた Web UI ライブラリ/フレームワーク 10 選

1. ITミルツールキットIT Mill Toolkit は、リッチ Web アプリケーション用のウ...

フレックスレイアウトにおけるflex-growとflex-shrinkの計算方法の詳しい説明

CSS のFlex(彈性布局)すると、Web ページのレイアウトを柔軟に制御できます。Flex Fl...

Vue ページに img 画像を導入する方法

HTMLを学ぶとき、画像タグ<img>は画像を導入します <img src=&qu...

Windows Server 2019 で NAS を構成する方法

序文このチュートリアルでは最新バージョンをインストールします。 NAS は非常に安定して動作するので...

CentOS 7 で PHP 5.4 を 5.6 にアップグレードする方法の簡単な分析

1.ターミナルに入ったらPHPのバージョンを確認するphp -v出力は次のようになります。 PHP ...

HTML ページの部分更新の実装コード

イベント応答の更新: 要求されたときのみ更新1. JS HTML DOM または jQuery を介...