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

HTML段落（pタグ）とは？基本構文と使い方を実例付きで解説

HTMLの段落は、<p>タグを使用して作成される段落要素です。<p>タグはブロックレベル要素に分類され、テキストを論理的なまとまりとして扱うことができます。文章を読みやすく構造化するうえで、最も基本的かつ重要な要素の一つと言えるでしょう。

基本構文

HTML段落の基本的な構文は以下のとおりです。

<p>コンテンツ</p>

<p>タグで囲まれたテキストが一つの段落として表示されます。開始タグと終了タグは必ずペアで記述してください。

使用例

それでは、HTML段落の具体的な使用例を見ていきましょう。以下のコードでは、見出し（h1）と段落（p）を組み合わせたシンプルなWebページを作成しています。

<!DOCTYPE html>
<html>
<style>
    body {
        color: #000;
        height: 100vh;
        background-color: #8BC6EC;
        background-image: linear-gradient(135deg, #8BC6EC 0%, #9599E2 100%);
        text-align: center;
    }
</style>
<body>
<h1>HTML Paragraphs</h1>
<p>I'm a paragraph element with some dummy text.</p>
</body>
</html>

出力結果

上記のコードをブラウザで開くと、グラデーション背景の中央に「HTML Paragraphs」という見出しと、その下に段落テキストが表示されます。このように<p>タグを使うだけで、簡単に段落を作成できることが確認できます。

HTML段落（pタグ）とは？基本構文と使い方を実例付きで解説


  1. HTMLレイアウト入門：セマンティック要素と主要なレイアウト手法を徹底解説

    HTMLレイアウトとは HTMLレイアウトとは、Webページ上に配置される各コンポーネント（ヘッダー、ナビゲーション、本文、フッターなど）の配置構造を定義する仕組みのことです。HTMLには、ページ内のさまざまなセクションを意味的に示すためのセマンティック要素が数多く用意されており、これらを活用することで、検索エンジンやスクリーンリーダーにも伝わりやすい、アクセシブルなページ構造を作れます。 HTMLレイアウトで使用される主なセマンティック要素 以下は、HTMLレイアウトでよく使われるセマンティック要素の一覧です。 タグ説明 <header>セクションまたはドキュメント全体

  2. HTMLエディターとは？代表的な無料エディターの特徴を徹底解説

    HTMLエディターとはHTMLエディターとは、HTMLドキュメントの作成・編集を行い、場合によってはその場で実行までできるツールのことです。現在では、無料・有料を問わず、プロフェッショナル向けの高機能なHTMLエディターが数多く提供されています。Windows標準のメモ帳（Notepad）にはない、テーマのカスタマイズやターミナル連携といった付加機能を備えたエディターも多く、用途やスキルレベルに合わせて選ぶことができます。ここでは、特によく使われている代表的なHTMLエディターをご紹介します。Notepad（メモ帳）最も基本的な無料HTMLエディターの一つです。Windowsに標準搭載されてお