Das<samp>HTML Element wird verwendet, um eingebetteten Text einzuschließen, der als Beispiel- (oder zitierter) Ausgaben von einem Computerprogramm dargestellt wird. Der Inhalt wird typischerweise mit der Standardschriftart des Browsers für Monospace-Schriften (wieCourier oder Lucida Console) angezeigt.

Probieren Sie es aus

<p>I was trying to boot my computer, but I got this hilarious message:</p><p>  <samp>Keyboard not found <br />Press F1 to continue</samp></p>

samp {  font-weight: bold;}

Attribute

Dieses Element beinhaltet nur dieglobalen Attribute.

Nutzungshinweise

Sie können eine CSS-Regel verwenden, um die Standardschriftart des Browsers für das<samp>-Element zu überschreiben; jedoch ist es möglich, dass die Browser-Einstellungen gegenüber jeglichen von Ihnen angegebenen CSS-Vorgaben Vorrang haben.

Das CSS zur Überschreibung der Standardschriftart würde wie folgt aussehen:

samp {  font-family: "Courier";}

Beispiele

Einfaches Beispiel

In diesem einfachen Beispiel enthält ein Absatz ein Beispiel für die Ausgabe eines Programms.

<p>  When the process is complete, the utility will output the text  <samp>Scan complete. Found <em>N</em> results.</samp> You can then proceed to  the next step.</p>

Ergebnis

Beispielausgabe, die Benutzereingaben beinhaltet

Sie können das<kbd> Element innerhalb eines<samp>-Blocks verschachteln, um ein Beispiel darzustellen, das vom Benutzer eingegebenen Text enthält. Betrachten Sie beispielsweise diesen Text, der ein Transkript einer Linux- (oder macOS-) Konsolensitzung präsentiert:

HTML

<pre><samp><span>mike@interwebz:~$</span> <kbd>md5 -s "Hello world"</kbd>MD5 ("Hello world") = 3e25960a79dbc69b674cd4ec67a72c62<span>mike@interwebz:~$</span> <span>█</span></samp></pre>

Beachten Sie die Verwendung von<span>, um das Erscheinungsbild bestimmter Teile des Beispieltextes, wie der Shell-Eingabeaufforderungen und des Cursors, anzupassen. Beachten Sie auch die Verwendung von<kbd>, um den Befehl darzustellen, den der Benutzer an der Eingabeaufforderung im Beispieltext eingegeben hat.

CSS

Das CSS, das das gewünschte Erscheinungsbild erzielt, ist:

.prompt {  color: #bb0000;}samp > kbd {  font-weight: bold;}.cursor {  color: #0000bb;}

Dies verleiht der Eingabeaufforderung und dem Cursor eine ziemlich subtile Kolorierung und hebt die Tastatureingaben innerhalb des Beispieltextes hervor.

Ergebnis

Die daraus resultierende Ausgabe ist:

Technische Zusammenfassung

Spezifikationen

Browser-Kompatibilität

Siehe auch

• Verwandte Elemente:<kbd>,<code>,<pre>
• Das<output> Element: ein Container für skriptgenerierte Ausgaben