<code></code>

更新日
仕様 HTML Living Standard
分類 フロー・コンテンツ / フレージング・コンテンツ / パルパブル・コンテンツ
利用場所 フレージング・コンテンツが置ける場所
内容 フレージング・コンテンツ

code要素は、コンピュータコードを表します。


<code>コンピュータコードを表します</code>

code要素は、コンピュータが認識する文字列（ソースコード、HTML要素名、ファイル名、他）に対して使用します。

このページでは<code>&lt;code&gt;</code>要素について説明しています。

pre要素との併用

ソースコードを記述する場合に、改行やインデントをそのままの形で表示したい場合には、次のようにpre要素内でcode要素を使用します。

<pre>
<code>&lt;html&gt;
&lt;head&gt;

    &lt;title&gt;文書のタイトル&lt;/title&gt;

&lt;/head&gt;
&lt;body&gt;

    &lt;h1&gt;pre要素 &amp; code要素の使用例&lt;/h1&gt;

&lt;/body&gt;
&lt;/html&gt;</code>
</pre>
  • タグを表示したい場合は、<や>の記号を&lt;&gt;と記述します。また、&記号も&amp;と記述しておきます。

要素のデフォルトスタイル

一般的なブラウザでは、この要素内のテキストは等幅フォントで表示されます。

  • ブラウザによっては、等幅フォントのテキストが小さめの文字サイズで表示されます。
code要素内のテキストです
  • 上記の表示例には、このページのスタイル（font-size: 100%）が適用されてしまっています。そのため、本来は小さめの文字サイズで表示されるブラウザでも、通常の文字サイズで表示されてしまいます。

使用例


<p>以下は、<code>script</code>要素の中で<code>document.write();</code>を使用しています。</p>

<pre>
<code>&lt;script&gt;

        document.write("サンプルテキスト");

&lt;/script&gt;</code>
</pre>
表示例

以下は、script要素の中でdocument.write();を使用しています。

<script>

        document.write("サンプルテキスト");

</script>