Ich würde gerne wissen, ob die Verwendung von Nicht-Standard-Tags in einer HTML-Seite für bestimmte benutzerdefinierte Zwecke empfehlenswert oder zulässig ist.
Beispielsweise:
Lorem ipsum dolor sitzt amet, consectetur adipiscing elit. Nullam consequat, felis sit amet suscipit laoreet, nisi arcu accumsan arcu, vel pulvinar odio magna suscipit mi.
Ich möchte "consectetur adipiscing elit" als wichtig und "nisi arcu accumsan arcu" als hervorgehoben markieren.
Also in den HTML würde ich setzen:
Lorem ipsum dolor sit amet, <important> consectetur adipiscing elit </ important>. Nullam consequat, felis sit amet suscipit laoreet, <highlighted> nisi arcu accumsan arcu </ highlighted>, vel pulvinar odio magna suscipit mi.
und im CSS:
important {
background: red
color: white;
}
highlighted {
background: yellow;
color: black;
}
Da dies jedoch keine gültigen HTML-Tags sind, ist dies in Ordnung?
quelle
<span class=..>
?<mark>
? developer.mozilla.org/en/HTML/Element/mark<em>
ist im Grunde dein<important>
und<mark>
ist dein<highlight>
.<strong>
sie für die Wichtigkeit besser geeignet ist als sie<em>
ist. Mein Fehler.Antworten:
Nein, das ist keine gute Praxis. Sie sollten bereits semantische, aussagekräftige Tags verwenden - vielleicht
<em>
in diesem Fall - und CSS-Stile anwenden, um Ihre Designanforderungen zu erfüllen.quelle
<em class="myclass">sample text</em>
CSS.myclass: { background: red; etc. }
Sie können den meisten Tags Klassen zuweisen, nicht nurem
. Normalerweisediv
oderspan
für Text. Siehe auchIhre Frage wurde gestellt, ob es sich um " bewährte oder legale Verfahren " handelt.
Erstens: Es ist irgendwie legal - zumindest wird es toleriert. Browser wurden immer so programmiert, dass sie mit Tags umgehen, die sie nicht verstehen, auch wenn sie diese einfach ignorieren. Dieser HTML-Code:
Wird so aussehen, ist jeder einzelne Browser:
Darüber hinaus können Sie dieses Element in den meisten Browsern in CSS formatieren. Wenn Sie also die folgende CSS-Definition hinzufügen:
Die meisten Browser werden jetzt wie folgt gerendert:
Wirklich: Probieren Sie es aus . Dies ist übrigens ein Trick, mit dem Webentwickler versuchen, sicherzustellen, dass neue HTML5-Tags in älteren Browsern korrekt angezeigt werden.
Das ist jedoch nicht das ganze Bild. Die vollständige Antwort lautet Nein, es ist keine gute Praxis . Vielleicht haben Sie bemerkt, dass ich den Ausdruck "die meisten Browser" verwende. Leider können alle Versionen von Internet Explorer vor IE9 dieses Verhalten nicht implementieren. In IE8 und früheren Versionen sieht der obige Code immer noch so aus:
Es gibt eine exzellent detaillierte Beschreibung des Problems bei Dive Into HTML5 , wo Sie auch Details einer Problemumgehung finden. Die Problemumgehung erfordert jedoch JavaScript, sodass es sich nicht um eine reine HTML-Lösung handelt und nicht in allen Szenarien funktioniert.
Also, kurze Antwort: Halten Sie sich nur an Standard-HTML-Elemente und gestalten Sie sie so, wie Sie es in Ihrem CSS möchten.
quelle
Wenn Sie die Semantik aus
<important/>
bestimmten Gründen beibehalten müssen, können Sie Ihre benutzerdefinierten Tags mithilfe von XSL in gültiges HTML umwandeln. Mehr zu diesem Thema können Sie hier lesen:http://www.w3.org/Style/XSL/WhatIsXSL.html
http://www.4guysfromrolla.com/webtech/081300-2.shtml
http://www.ibm.com/developerworks/xml/library/x-tiphtml/index.html
http://www.siteexperts.com/tips/xml/ts01/page5.asp
http://www.htmlgoodies.com/beyond/xml/converting-xml-to-html-using-xsl.html
Sie können
<important/>
die endgültige HTML-Ausgabe immer noch nicht haben , aber Sie können sie automatisch in so etwas wie transformieren lassen<span class="important"...
.quelle
Hier finden Sie einige Antworten, die erklären, warum Sie niemals Ihre eigenen benutzerdefinierten Tags erstellen sollten. Sie sind wohl alle falsch.
WHATWGs Analyse von benutzerdefinierten Tags kommt zu dem Schluss, dass diese akzeptabel, standardkonform (da der Umgang mit nicht erkannten Tags klar definiert ist) und zugänglicher sind als beispielsweise das Gestalten eines generischen Div.
Was Sie tun sollten, was das OP nicht getan hat, ist, allen benutzerdefinierten Tags das Präfix 'x-' gemäß Konvention voranzustellen. Dies weist eindeutig darauf hin, dass dieses Tag für Ihr Dokument lokal sein soll, und vermeidet Konflikte mit zukünftigen Spezifikationselementen.
Einige argumentieren, dass bestimmte gängige Browser keine standardkonformen benutzerdefinierten Tags verarbeiten und daher nicht verwendet werden sollten. Das Verhalten von nicht kompatiblen Browsern ist jedoch ein eigenes Problem und zwingt Sie vorzugsweise nicht zum Schreiben von nicht semantischem Markup. Es gibt sowohl Javascript- als auch Nicht-Javascript-Lösungen für dieses Problem, die nur für die nicht kompatiblen Browser angewendet werden sollten, die Sie speziell unterstützen möchten.
Wenn jedoch ein Tag in der Spezifikation (<mark>) vorhanden ist, das die semantische Bedeutung des von Ihnen erstellten Tags (<highlight>) klar abdeckt, ist es sicherlich vorzuziehen, das vorhandene Tag zu verwenden.
quelle
<x-accordion data-notes="D2 D3 F3 A3 C4">Dm7</x-accordion>
?Sie können
<em />
und<strong />
mit benutzerdefiniertem CSS verwenden, um die Darstellung zu ändern.Stark, bezieht sich auf eine stärkere Bedeutung.
Betonung bezieht sich auf erhöhte Betonung.
quelle
Auf der praktischen Seite ist es nicht erforderlich , neue Tags zum Hervorheben zu verwenden. Sie können verwenden
em
oderi
Tags , wenn Sie es vorziehen , kursiv als Standard (nicht-CSS) Rendering undstrong
oderb
wenn Sie es vorziehen , Bolding als Standard. Wenn Sie aus irgendeinem Grund das Standard-Rendering als normalen Text bevorzugen, dh keine Hervorhebung, verwenden Siespan
. In jedem Fall können Sie einclass
Attribut verwenden, um diese Verwendung von einer anderen Verwendung zu unterscheiden, die Sie möglicherweise für das Markup haben.HTML-Spezifikationen und (HTML5-) Entwürfe sind in Bezug auf die Semantik dieser Elemente unklar, dies muss jedoch keine größeren Kopfschmerzen verursachen.
quelle
em
undstrong
sollten verwendet werden, wenn dies semantisch korrekt ist, und nicht, wenn fett oder kursiv gedruckt werden soll. Sie können die Darstellung mit CSS ändern.Nein, obwohl in XHTML neue Tags aus einem anderen Namespace hinzugefügt werden dürfen, wird von der Verarbeitung nicht angegebener HTML-Tags dringend abgeraten.
quelle
Nun, es ist legal, dass Sie nicht dafür verhaftet werden. Aber wenn Attentäter vom W3C an Ihrer Tür auftauchen, wundern Sie sich nicht.
Zunächst einmal werden andere Entwickler nicht wissen, was sie bedeuten. Im Fall von
<important>
und ist dies der Fall<highlight>
, aber wenn Sie so etwas wie sagen,<set>
wissen Sie vielleicht, dass Sie sich auf eine mathematische Menge beziehen, aber jemand anderes, der Ihren Code liest, könnte ihn für etwas anderes halten. Ohne die Spezifikation, um eine Antwort zu geben, könnte es viel Verwirrung geben.Zweitens, was ist, wenn das W3C entscheidet, dass ein
<important>
Element eine gute Idee ist, aber der Meinung ist, dass dies eine dringende Benachrichtigung bedeuten sollte, wie zDann bist du fertig. Browser und Ihre Kollegen Entwickler werden ziemlich verwirrt sein. Sie werden Sie wahrscheinlich zwingen, Ihren Code mit regulären Ausdrücken zu analysieren, bis Sie verrückt werden. Und wir alle wissen, wie sich das herausstellt.
Drittens können Sie mit IE <9 unbekannte Elemente nicht ohne einen kleinen Hack formatieren. Keine große Sache, aber nervig.
Zuletzt in diesem Fall
<important>
und<highlight>
bereits vorhanden!<strong>
und<mark>
sind was du suchst. Entsprechend der HTML5-Spezifikationund
Wenn Sie es nicht für "Referenzzwecke" verwenden, wäre ein
<span>
mit einer Klasse in Ordnung.quelle
http://www.w3.org/TR/html5/elements.html
Dies ist Revision 1.5612.
Autoren dürfen keine Elemente, Attribute oder Attributwerte verwenden, die von dieser Spezifikation oder anderen anwendbaren Spezifikationen nicht zugelassen sind, da dies die zukünftige Erweiterung der Sprache erheblich erschwert.
quelle
Ignorieren jeder anderen Meinung hier.
Es ist aus zwei sehr wichtigen Gründen keine gute Übung:
Erstens ist es durchaus möglich, dass das Normungskomitee irgendwann beschließt, ein Tag mit dem Namen aufzunehmen
<important>
, das Ihre Verwendung dafür verfälscht. Sicher, es könnte eine Weile dauern. Aber es ist möglich, dass Sie Zeit damit verschwenden, es danach herauszureißen.Zweitens (dies ist der eigentliche Grund) wird der Programmierer, der Ihren Code erbt, entweder ständig "wtf" sagen, während er all das herauszieht, oder, ebenso gut möglich, völlig verwirrt sein von dem, was Sie sind habe getan und einfach frustriert gekündigt.
Also sei nett. Man weiß nie, vielleicht bittet man eines Tages einen von ihnen um einen Job.
quelle
Nein, Sie können keine eigenen HTML-Tags erstellen, da Sie dann alle gängigen Browser zum Implementieren dieser Tags veranlassen müssten. Wenn Browser derzeit ein nicht erkanntes Tag finden, ignorieren sie alle darin enthaltenen Tags. Sofern Sie also nicht möchten, dass Ihr eigener Browser ein neues erstellt Tags sind sinnlos und funktionieren auch dann nur in Ihrem Browser.
Sie könnten versuchen, einen Anwendungsfall für sie beim w3c einzureichen, aber ich bezweifle, dass es irgendwohin kommen würde.
quelle
Nein, es ist keine gute Praxis aus allen Gründen, die von allen anderen Antworten geliefert werden. Anstatt diese Punkte zu wiederholen, möchte ich eine Option vorstellen, die ich in diesen Antworten nicht gesehen habe!
Für den Fall, dass keine Tags vorhanden sind, deren semantische Bedeutung Ihren Zielen entspricht, können Sie eine Kombination aus CSS und dem neuen
data-*
Attribut in der HTML 5-Spezifikation verwenden. Dies funktioniert natürlich mit den meisten Tags, die Sie auswählen.Beispiel:
Dies ist zwar keine perfekte Lösung, da es keine genau definierte semantische Bedeutung für
data-*
Attribute gibt, aber Sie können zumindest denjenigen zusätzliche Informationen bereitstellen, die die Bedeutung Ihresdata-type
Attributs kennen.quelle