2021/2/18 HTML&CSS辞典をオープンしました! コンテンツは随時更新します!

pre要素とは? 分かりやすく解説します!

pre要素の評価
頻出度
(3.0)
重要度
(3.0)
総合評価
(3.0)




1.pre要素とは?

pre要素は整形済みテキストを表します。

整形済みテキストはプログラムのソースコードのように空白、タブ、改行も含めソースやテキストをそのまま表示するテキストのことです。

pre要素は自動的な折り返しがされなくなるので、ソースコードなどをそのまま表示する時に便利です。

※「<」、「>」、「&」などは特殊文字として認識されるので、実体参照に置き換えて書く必要があります。




2.pre要素の使い方

それではpre要素の使い方をみていきましょう。

・・・

<pre>
 <code>
  function pre() {
   console.log("pre要素とは?")
  }
  pre()
 </code>
</pre>

・・・

上記はpreタグとcodeタグを用いてJavaSctriptのソースコードをHTML内に埋め込んだものとなっています。

codeタグの外側をpreタグで囲むことでソースコードのインデントが揃い、読みやすいソースコードになっています。




コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です