pre

HTMLタグについてのブログ記事

preタグの概要

preタグは、その中のテキストをそのまま表示するためのタグです。改行や空白などもそのまま反映されるため、コードやテキストのフォーマットを保持したい場合に使用されます。

コードやテキストの整形された表示をしたいときに使われます。

基本の書き方(構文)

<pre>
  ここにテキストやコードを入力します。
</pre>

主な属性とその説明

preタグには特定の属性はありません。

使用例

<pre>
  <p>Hello, World!</p>
  <div>
    <p>This is a sample text.</p>
  </div>
</pre>
<pre>
  <html>
    <head>
      <title>Sample Page</title>
    </head>
    <body>
      <h1>Welcome to my website</h1>
    </body>
  </html>
</pre>
<pre>
  function greet() {
    console.log("Hello, World!");
  }
  greet();
</pre>

よくある注意点・間違い

preタグはコードやテキストの整形された表示に使用されるため、必要以上に使いすぎるとページのレイアウトが乱れる可能性があります。適切に使用することが重要です。