記事でタグ（ソースコード）を紹介する時に記事のソースをそのまま表示したいことがあります。
ブラウザにソースコードをそのまま表示する方法とは？

codeとpre

プログラムのソースコードであることを示すのにはcode要素を使用します。
しかしソースコードの多くには空白やインデントを使用しますので、そのまま保持するためにpre要素と併用します。

下記のようになります。

<pre>
<code>
ソースを記述
</code>
</pre>

エスケープ

但し「>」「<」「&」等は、タグとして解釈されてしまうので、これらの記号を表示させたい場合はエスケープする必要があります。

& ⇒&amp;
< ⇒&lt;
> ⇒&gt;

もっとも、ワードプレスの場合、「ビジュアルモード」でソースを書けば、上の変換（エスケープ）をする必要はありません。

スタイルを指定

preタグの内容を目立たせたい時は、スタイルを指定します。

（例）

pre{
margin:10px;
background
}

HTML // ワードプレスの関連記事