10 nicht ausreichend genutzte oder missverstandene HTML-Tags_HTML/Xhtml_Webdesign

Hier sind 10 nicht ausreichend genutzte oder missverstandene HTML-Tags. Sie sind vielleicht nicht allgemein bekannt, können aber in bestimmten Situationen sehr nützlich sein.
Webentwickler möchten oft mehrere Sprachen kennen und beherrschen. Daher kann es schwierig sein, alle Besonderheiten einer Sprache zu erlernen, aber es ist leicht, festzustellen, dass Sie die speziellen, aber nützlichen Tags nicht vollständig nutzen.
Übersetzt von: TutsPlus
Leider haben wir noch nicht das volle Potenzial dieser eher undurchsichtigen HTML-Tags ausgeschöpft. Aber es ist nie zu spät, wieder ins Feld zu gehen und mit dem Schreiben von Code zu beginnen, um die Leistungsfähigkeit dieser unerschlossenen Labels zu nutzen.
Hier sind 10 nicht ausreichend genutzte oder missverstandene HTML-Tags. Sie sind vielleicht nicht allgemein bekannt, können aber in bestimmten Situationen sehr nützlich sein.
1.
Es scheint, dass jeder mit dem

-Tag vertraut ist, aber kennen Sie

s kleinen Bruder ? Mit können Sie Text innerhalb des Elements als Referenz definieren. Normalerweise schreiben Browser den Text innerhalb des -Tags kursiv, aber das kann mit ein wenig CSS geändert werden. Das
-Tag eignet sich zum Zitieren von Referenzen in Verzeichnissen oder anderen Websites. Hier ist ein Beispiel für die Verwendung des Cite-Tags in einem Absatz:
David Allens bahnbrechendes Organisationsbuch Get Your Work Done erobert das Vergessen im Sturm. 2. Das
-Tag ist eine großartige Möglichkeit, die Gruppierung von Optionen innerhalb eines Select-Tags zu definieren. Wenn Sie beispielsweise eine Liste von Filmen nach Zeit gruppieren müssen, können Sie Folgendes tun:
1 2
Label für="Showtimes">Showtimes/ Beschriftung> wählen id="showtimes" Name= "showtimes"> optgroup label="One PM">/ optgroup> option value="titanic">Titanic/Option> Option Wert= "nd">Slumdog Millionaire/Option> Option Wert="wab">Shrek/Option> optgroup label="Zwei Uhr nachmittags">/optgroup > Option Wert="bkrw">Der König der Löwen/Option> Option Wert="stf" > Superman für alle/Option> /auswählen>
Demo:
Veröffentlichungszeit Titanic Slumdog Millionär Shrek Der König der Löwen Superman für alle

Es kann die Filmliste visuell unterscheiden. 3.
ist eine Möglichkeit, eine Reihe von Wörtern zu definieren oder näher zu erklären. Wenn Sie mit der Maus über den Text mit dem -Tag fahren, wird unten ein Feld mit dem Inhalt des Titel-Tags angezeigt. Zum Beispiel:
1
Mikroblog-WebsiteAkronym Titel="Gegründet 2006">Twitter/Akronym> In letzter Zeit ist es stark zurückgegangen.
Beispiel:
Die Mikroblogging-Website Twitter war in letzter Zeit häufig ausgefallen. 4.

Das

-Tag ist ein sehr unauffälliges kleines Tag, aber das bedeutet nicht, dass es nutzlos ist. Wie der Name schon sagt, ermöglicht Ihnen

die Semantisierung von Tags in HTML. Dieses kompakte Tag zeigt den Inhalt des Tags standardmäßig kursiv an. Natürlich kann der Standardstil mithilfe von Stilen leicht geändert werden.
1 2 3 4
Adresse>Glen Stansberry 1234 Web Dev Lane Überall, USA /Adresse> 5. und
Wenn Sie Tags verwenden möchten, um bearbeitete Versionen anzuzeigen, sind und perfekt dafür geeignet. Wie der Name schon sagt, hebt hinzugefügte Inhalte durch Unterstreichungen hervor, während entfernte Informationen durchgestrichen anzeigt.
1
John del>likes/del> ins >LIEBT/in>seinen neuen iPod.
Beispiel:
Jeder mag verlassene Zblog. 6.
Es scheint, dass man bei Formularelementen am leichtesten vergisst, wann Text markiert werden muss. Bei Formularelementen wird am häufigsten das -Tag vergessen. Dies ist nicht nur eine bequeme Möglichkeit, Text zu markieren, dem -Tag kann auch ein „for“-Attribut übergeben werden, um anzugeben, welches Element zugeordnet wird. Die Steuerung mit Stilen ist nicht nur einfach, Sie können damit auch den Titel anklickbar machen.
1 2
Label für="Benutzername">Benutzername/Beschriftung> Eingabe id="Benutzername" Typ= „Text“ /> 7.

Fieldset ist ein kleines Tag, mit dem Sie Ihren Formularelementen logische Gruppierungen hinzufügen können. Das

-Tag zeichnet einen Rahmen um das darin enthaltene Element. Ein weiterer Punkt ist, dass Sie das Tag im Feldsatz hinzufügen können, um den Titel der Gruppe zu definieren.
1 2 3 4 5 6 7
Formular>Feldsatz> Legende>Sind Sie schlauer als ein Schüler der 5. Klasse? /Legende> NatürlichEingabe Name="Ja" Typ=„Radio“ Wert=„Ja“ /> Weiß nichtEingabe Name="Nein" Typ="Radio" Wert="Nein" /> /fieldset> /Formular>
Beispiel: 8. Das
-Tag ist dem -Tag ziemlich ähnlich, mit der Ausnahme, dass das -Tag nur zur Definition abgekürzter Wörter verwendet wird. Genau wie können Sie für dieses Tag ein Titelattribut definieren. Wenn der Benutzer mit der Maus über den Abkürzungstext fährt, wird der gesamte Inhalt darunter angezeigt. Das -Tag wird selten verwendet, ist aber für Bildschirmleseprogramme, Rechtschreibprüfungen und Suchmaschinen sehr nützlich.
1
Abkürzung Titel="Brainless">NC/abbr> ist ein unzivilisierter Begriff.
Beispiel:
ist ein unzivilisierter Begriff. ist ein unzivilisierter Begriff. 9. rel
Rel kann ein äußerst nützliches -Attribut sein. Auf jedes HTML-Element kann ein rel-Attribut angewendet werden. Es ist hilfreich, zusätzliche Parameter zu übergeben, die nicht anderweitig angegeben sind. Dies ist sehr nützlich, wenn Sie JavaScript in HTML verwenden. Wenn Sie einen Link haben, den Sie inline bearbeiten möchten, können Sie Folgendes hinzufügen:
1
a rel="clickable" href= "page.html">Dieser Link kann bearbeitet werden. /a>
Javascript sucht nach einem Link mit dem rel-Attribut „anklickbar“, wendet etwas Ajax an und ermöglicht die Inline-Bearbeitung. Dies ist nur eine der vielen Techniken, mit denen Sie das rel-Attribut verwenden können, da sein Potenzial endlos ist. Interessierte Freunde können die W3C-Einführung in Rel ausführlich studieren. 10. Das Tag
ist ein unglaublich unbekanntes Tag. Ehrlich gesagt bezweifle ich, dass Sie jemals auf dieses Etikett stoßen werden, da es so gut wie nie verwendet wird. (Tatsächlich hatte ich dieses Etikett kaum gesehen, bevor ich diesen Artikel schrieb). Tatsächlich handelt es sich bei diesem Tag um einen weichen Zeilenumbruch, mit dem Sie einen Zeilenumbruchpunkt in einer bestimmten Zeile angeben können, was darauf hinweist, dass die Zeile an dieser Stelle umgebrochen werden kann, der Zeilenumbruch jedoch nicht unbedingt durchgeführt wird, und der Zeilenumbruch wird ausgeführt treten nur dann auf, wenn ein Zeilenumbruch erforderlich ist. Die Verwendung dieses Tags eignet sich hervorragend, wenn Sie horizontale Bildlaufleisten vermeiden möchten.
Beispiel:
Unten sehen Sie ein 200 Pixel breites Feld ohne definierten Überlauf. NoWbrNoWbrNoWbrNoWbrNoWbrNoWbrNoWbrNoWbrNoWbr
HavaWbrHavaWbrHavaWbrHavaWbrHavaWbrHavaWbrHavaWbrHavaWbr
Wenn Sie den gleichen Effekt ohne Verwendung des -Tags erzielen möchten, können Sie dies oder versuchen. Es heißt, dass keines dieser drei Tags von allen Browsern vollständig unterstützt wird. Mithilfe dieses Artikels können Sie die Unterstützung jedes Browsers für die drei Tags überprüfen.
PS: Es war ziemlich schwierig, diesen Artikel zu übersetzen. Ich glaube, dass es viele Tags gibt, die wir nicht kennen. Es gibt bekannte und ungewöhnliche Tags, die nicht jeder verwenden wird. Wie ich bereits in einem Artikel erklärt habe, besteht ein großer Teil der „Semantik“ darin, die richtigen Tags an den richtigen Stellen zu verwenden, anstatt nur Divs zu verwenden. Wenn wir mehr HTML-Tags verstehen können, können wir mehr semantischen HTML-Code schreiben, was auch die Schwierigkeit und Arbeitsbelastung beim Schreiben von CSS erheblich reduzieren und unsere Seitenstruktur vernünftiger gestalten kann.