Was sind die Unterschiede zwischen kbd, samp und code in HTML?

Richtig. Die semantische Bedeutung ist anders. Das Standard-Rendering ist die Verwendung einer Monospace-Schriftart, da dies am besten geeignet ist.

<kbd> steht für die Tastatureingabe, obwohl StackOverflow wie echte Schlüssel darstellt.

<samp> steht für Beispielcomputerausgabe, und ursprünglich waren die Computer nicht gleichlaufend:)

<code> steht für die Eingabe des Programmiercodes, und die überwiegende Mehrzahl der Programmiersprachen ist so konzipiert, dass sie einen Editor mit einem gleichmäßigen Editor annehmen - mit Ausnahme von C ++, das aus verschiedenen Gründen variable Breite und einige Python-Rassen bevorzugt. Beachten Sie, dass <code> ein Inline-Element ist, während <pre> für Markup auf Blockebene (d. H. Absätze) von Code verwendet wird.

Die Tatsache, dass das Standard-Rendering das gleiche ist, bedeutet nicht, dass Sie Ihre eigenen Rendering-Stile wie StackOverflow nicht zuweisen können.

In HTML erhalten Sie verschiedene Eimer mit Tag-Suppe , um Ihre Komponenten zu bauen. Es gibt die <TABLE> Familie von Tags und zugehörigen Eigenschaften und zugehörigem CSS, die <SECTION> Familie von Tags und Eigenschaften und CSS (zum Beispiel zum Erstellen von Nachrichten und Blog-Layouts).

Dann gibt es eine Gruppe von SVG-bezogenen Dingen, die <OBJECT> -Familie für eingebettete Plugins und so weiter. Jedes Feature, das jemals hinzugefügt wurde, hat seinen eigenen kleinen domänenspezifischen Satz von Begriffen und Definitionen. Die Layout-Regeln unterscheiden sich, Sie können nicht dasselbe CSS mit einem <TABLE> verwenden, als würden Sie beispielsweise mit einem <SECTION> arbeiten.

Es gibt also einen logischen / Metadaten-Unterschied und einen funktionalen / Nutzungsunterschied. Je nachdem, welchen Browser Sie verwenden, kann das Standard-Browser-Stylesheet einige Elemente optisch ähnlich darstellen, wenn Sie sie einfach nebeneinander auf eine Seite legen, ohne eine Struktur zu haben.

Die Idee besteht darin, diese Dinge ineinander zu fügen, so:

mit CSS, das ungefähr wie folgt aussieht:

Wenn Sie den obigen <p> von <article> -Kontext übernehmen oder den <h1> entfernen, wird das CSS, das es von einem normalen <p> unterscheidet, nicht funktionieren. Standard-Browser-Stile sind ähnlich.

Untersuchen Sie, wie diese Kategorien von Tags verwendet werden. Sehen Sie sich einen Twitter Bootstrap-Beispielcode an.

Alle diese Tags sind für 1) Sie zu verwenden, 2) Suchmaschinen zu verstehen, 3) Sie / jemanden später zu verstehen.

Erfahren Sie, was die verschiedenen Buckets sind, und beginnen Sie, die Tags zu verwenden. es gibt nicht wirklich so viele Kategorien von ihnen.

Das kbd -Element repräsentiert Benutzereingabe. Beispiele für Benutzereingaben sind:

Schlüsseleingabe

Terminal-Befehl

Schaltflächen oder Menü (GUI-Eingabe)

Datei | Öffnen ...

Das samp -Element repräsentiert die Ausgabe von einem Programm oder Computersystem. Zum Beispiel eine cmd Ausgabe:

Wie sieht es in HTML mit samp aus:

Das Element code repräsentiert ein Fragment des Computercodes. Beispiele für Computercode sind: Name des XML-Elements, Dateiname, Computerprogramm usw.

Codebeispiel:

Ich möchte auch sagen, dass Sie hinsichtlich des visuellen Erscheinungsbildes recht haben. Es gibt höchstens einen Unterschied zwischen kbd, samp und code. Alle von ihnen verwenden die gleiche Schriftart. Allerdings wäre es besser, wenn du es so ein beschrieben verwendest, denn das System macht einen Unterschied zwischen ihnen.