<code></code>
| ブラウザ |
|
|---|---|
| 分類 | フロー・コンテンツ / フレージング・コンテンツ / パルパブル・コンテンツ |
| 利用場所 | フレージング・コンテンツが置ける場所 |
| 内容 | フレージング・コンテンツ |
code要素は、ソースコードなどを表します。
- デフォルトスタイル(等幅フォント)
<code>ソースコードなどを表します</code>
code要素は、コンピュータが認識する文字列(ソースコード、HTML要素名、ファイル名、他)に対して使用します。
この要素は文章の中でも使用することができます。
このページでは<code><code></code>要素について説明しています。
pre要素との併用
ソースコードを記述する場合で、改行やインデントをそのままの形で表示したい場合には、次のようにpre要素内でこの要素を使用します。
<pre>
<code><html>
<head>
<title>文書のタイトル</title>
</head>
<body>
<h1>pre要素 & code要素の使用例</h1>
</body>
</html></code>
</pre>
- タグを表示したい場合は、
<や>の記号を<>と記述します。また、&記号も&と記述しておきます。
要素のデフォルトスタイル
一般的なブラウザでは、この要素内のテキストは等幅フォントで表示されます。
- ブラウザによっては、等幅フォントのテキストが小さめの文字サイズで表示されます。
<code>ソースコードなどを表します</code>
- 上記の表示例には、このページのスタイル(
font-size: 100%)が適用されてしまっています。そのため、本来は小さめの文字サイズで表示されるブラウザでも、通常の文字サイズで表示されてしまいます。
使用例
<p><code>script</code>要素の中で、<code>document.write();</code>を使用しています。</p>
<pre>
<code><script type="text/javascript">
document.write("サンプルテキスト");
</script></code>
</pre>
- 表示例
-
script要素の中で、document.write();を使用しています。<script type="text/javascript"> document.write("サンプルテキスト"); </script>
- 上記のcode要素内のテキストには、このページのスタイルが適用されてしまっています。そのため、本来は小さめの文字サイズで表示されるブラウザでも、通常の文字サイズで表示されてしまいます。