HTML辞書ホームへ
HTML要素 辞書 by Sentaro
<samp>
サンプル出力（Sample Output）要素。プログラムやコンピュータシステムによる出力例を示すための要素です。
info
概要
<samp> 要素は、プログラム、スクリプト、またはコンピュータシステムからの**サンプル出力**を示すために使用されます。通常、ブラウザはこれを等幅フォント（monospace）で表示します。
ユーザーの入力（<kbd>）、変数の名前（<var>）、プログラムのコード（<code>）と区別して使用されます。
play_circle
デモ (静的表示)
HTML (Source)
コマンドを実行すると、以下のような出力が表示されます:
<samp>
Hello, World!
</samp>
<br><br>
エラーメッセージ:
<samp>
File not found: index.html
</samp>
Preview (Result)
コマンドを実行すると、以下のような出力が表示されます:
Hello, World!
エラーメッセージ: File not found: index.html
エラーメッセージ: File not found: index.html
list
属性 (Attributes)
| 属性名 | 説明 |
|---|---|
| グローバル属性 | 全てのHTML要素で使用できる標準的な属性（class, id, style, langなど）が使用可能です。 |
| なし | <samp>要素に固有の必須属性はありません。 |
code
実用例
1. システムの標準出力の表示
<!-- コマンドの出力結果を示す -->
$ ls
<samp> index.html styles.css script.js </samp>
<samp> index.html styles.css script.js </samp>
2. ユーザー入力 () との組み合わせ
<!-- ユーザーが入力したコマンドとその出力 -->
<p>
<kbd>format c:</kbd> と入力すると、
<samp>Are you sure? (Y/N)</samp>
というメッセージが表示されます。
</p>
3. 複数行にわたる出力の表示
<!-- 複数行の出力には <pre> の中に <samp> を含めるのが一般的 -->
<pre><samp>
---------------------------------
| Total files: 12 |
| Total size: 45.6MB |
---------------------------------
</samp></pre>
lightbulb
知っておくべき重要事項
security
その他のコード関連要素との使い分け
<samp> は、あくまで**プログラムの出力**を示すためのものです。
<samp> は、あくまで**プログラムの出力**を示すためのものです。
- <code>：プログラムの**ソースコード**自体。
- <kbd>：ユーザーの**入力**（キーボード入力や音声コマンドなど）。
- <var>：プログラミングの**変数**。
accessibility_new
デザインとセマンティクス
もし単にテキストを等幅フォントにしたいだけで、それが「プログラムの出力」という意味を持たない場合は、CSSで
もし単にテキストを等幅フォントにしたいだけで、それが「プログラムの出力」という意味を持たない場合は、CSSで
font-family: monospace; を適用するべきです。<samp> 要素は、そのコンテンツが持つ意味を伝えるために使用しましょう。