Verstehen Sie die Grundlagen und den Einfallsreichtum von HTML vollständig

Vorwort

Auf Webseiten wird HTML am häufigsten übersehen, und fast alle Entwickler verachten HTML. Grundlegendes HTML zu schreiben ist sehr einfach, aber wenn man das Niveau der Webseitenarchitektur, die Codeleistung, die Wartung, die SEO-Suche und die clevere Verwendung von HTML-Tags berücksichtigt, ist es eine andere Wissenschaft.

1. Was ist HTML?

html, auch als Hypertext-Auszeichnungssprache bekannt. Es gehört nicht zu den Programmiersprachen, da es keine Logik hat und nur als Markup bezeichnet werden kann. Es ist jedoch ein unverzichtbarer Bestandteil der Webseite und hauptsächlich für die Struktur der Webseite verantwortlich.

2. Grundlegende HTML-Kenntnisse (kontinuierlich ergänzt)

1. Das semantische Tag von HTML5;
sein Vorteil besteht darin, dass es wartbareren Code schreiben kann, was der Suchmaschinensuche förderlich ist. Die Kern-Tags sind Kopfzeile, Navigation und Fußzeile und werden hier natürlich nicht aufgeführt.

2. Elemente auf Blockebene, Inline-Elemente, Inline-Elemente;
Elemente auf Blockebene: div, p, h1~h6, Adresse, ol, ul, li, Fieldset, Tabelle
Inline-Elemente: (Inline-Elemente): span, i, em , strong, b, ins...sub, sup, a, label
Inline-Blöcke: img, frameset, form, input, textarea
sind eigentlich alles Abkürzungen. Wenn wir Suchmaschinen und Leistungserhaltung berücksichtigen möchten, geben wir der Auswahl von Semantik Vorrang Tags wie „em“ sind die Abkürzung für „hervorheben“ und sind für Browser leichter zu erkennen als i-Tags.

Diese Tags verfügen auch über ein Konzept der physischen Markierung und der logischen Markierung . B ist beispielsweise ein physisches Markup, und das physische Markup teilt dem Browser mit, dass ich es fetter machen möchte. Machen Sie es einfach für mich fett und lassen Sie den Rest in Ruhe. „Stark“ ist ein logisches Markup, das den Browser anweist, Fett hervorzuheben, und der Ton ist schwerer.
Kurz gesagt lautet das Obige: Das physische Element teilt dem Browser mit, in welchem ​​Format ich den Text anzeigen soll, und das logische Element teilt dem Browser mit, wie wichtig diese Texte sind. Im Allgemeinen empfehlen wir die Verwendung logischer Tags, die für Suchmaschinen vorteilhafter sind und den Entwicklern eine intuitivere Bedeutung vermitteln.

3. Die Etikettenstruktur enthält Probleme.
Elemente auf Blockebene können beliebige Elemente enthalten, es wird jedoch nicht empfohlen, dass p-Tags divs enthalten. Das Element enthält zwei p-Tags.
Inline-Elemente dürfen keine Elemente auf Blockebene enthalten.
Ein Tag darf kein Tag enthalten

4. Die Rolle des a-Tags
Das a-Tag wird auch Ankerpunkt genannt. Normalerweise verwenden wir das Attribut href, um Linksprünge durchzuführen. Tatsächlich hat dieses Etikett noch andere Funktionen, wie zum Beispiel:
Anrufen,
E-Mail-Versand,
Positionierungselemente usw.

5. Frameset: Dieses Tag kann eine Frame-Form darstellen. Da es jedoch äußerst unfreundlich für Suchmaschinen ist und Leistungs- und Kompatibilitätsprobleme aufweist, wurde es entfernt. Programmierer verwenden dieses Tag in den letzten Jahren gerne zum Erstellen von Spalten. Es kann nicht gleichzeitig mit dem Body-Tag erscheinen. Es kann den Rand ziehen. Gleichzeitig verfügt es über ein Namensattribut, mit dem mit dem Tag-Attribut gesprungen werden kann. Das Iframe-Tag wird vom Frameset abgeleitet

6. sub, sup obere und untere Eckmarkierungen.

7. Geordnete, ungeordnete und benutzerdefinierte Listen
ol>li ul>li dl>dd>dt Am häufigsten wird die ungeordnete Liste verwendet. Normalerweise verwenden wir es für das Layout. Geordnete Listen können Zahlen, Buchstaben usw. voranstellen. Verfügbare Attributeinstellungen
Die benutzerdefinierte Liste kann eine Hierarchie generieren, was im Allgemeinen nicht empfohlen wird. Unsere Entwicklung muss angepasst werden und wir mögen keine benutzerdefinierten Hierarchien.

8. Tabellen-Tags table thead tbody tr td tfoot
Frühere Programmierer verwendeten gerne Tabellen-Tags für Layouts und einfache Tabellen, aber mittlerweile sind Tabellen-Tags nach und nach aus der Sicht verschwunden.
Wenn wir Tabellen-Tags verwenden, wird empfohlen, die drei Tags von thead tbody tfoot zu schreiben (schreiben Sie diese drei nicht und schreiben Sie direkt die Tabellenzeile und -spalte, wodurch kein Fehler gemeldet wird). Es ist nicht nur semantischer, sondern auch besser für ein solches Szenario geeignet: Angenommen, es gibt jetzt 1 W Daten, wenn keine Paginierung vorhanden ist und wir keine drei Tags festlegen, wird die Tabelle erst gerendert, wenn die Daten geladen sind. Wenn es festgelegt ist, werden thead und tfoot zuerst geladen, wodurch das Problem vermieden wird, auf das Rendern der Daten im Tbody zu warten, bevor die Tabelle gerendert wird.

9. Das unauffälligste Span-Tag.
Wir verwenden es im Allgemeinen in Szenarien, in denen Text hervorgehoben wird. Zum Beispiel: <p>HTML-Grundlagen <span color="red"> sind sehr wichtig</span> </p>

10. Fieldset ähnelt einem Formular und kann übermittelt werden. Der einzige Unterschied besteht darin, dass es einen Standardstil hat.

Zusammenfassen

Das Obige ist eine Zusammenfassung des grundlegenden Inhalts von HTML. Es gibt weit mehr als diese Tags. Vor HTML5 gab es insgesamt 98, und in HTML5 wurden 30 hinzugefügt, und es gibt viele Tag-Attribute, die sehr flexibel sind. Allerdings sind Bei der Ableitung von Komponentenbibliotheken und Frameworks verwenden wir diese im Allgemeinen nicht. Ursprünglich für Unternehmensgeschäfte. Ich hoffe, dass jeder HTML richtig verstehen kann, es keinen Unterschied in der Technologie gibt und die Fähigkeiten tiefgreifend sind. Ich werde die oben genannten Schlüsselkenntnisse über HTML weiterhin aktualisieren und freue mich über Ihre Ergänzungen und Korrekturen~

Supongo que te gusta

Origin blog.csdn.net/weixin_53291256/article/details/124029849
Recomendado
Clasificación