Heim > Artikel > Web-Frontend > So verwenden Sie wichtige und schwierige Tags in HTML
Der Grund für das Schreiben dieses Artikels ist, dass ich in letzter Zeit Front-End-Kenntnisse erlernt habe. Daher habe ich speziell die Verwendung einiger Schlüssel-Tags zusammengestellt, um zukünftige Überprüfungen zu erleichtern.
1. Verwendung eines Tags
Erstellen Sie einen Hyperlink zu anderen Webseiten, Dateien, Orten innerhalb derselben Seite, E-Mail-Adressen oder einer anderen URL. Das a-Tag ist ein sehr häufig verwendetes Tag, aber ich glaube, dass viele seiner Verwendungsmöglichkeiten nicht gut verstanden sind.
Attribut: Der Wert von href von
a:
kann eine URL (vorzugsweise geschrieben in der Form //google.com), ein Pfad (/a/b/c, index.html), ein Pseudoprotokoll (js Code, E-Mail, Mobiltelefonnummer) ID wird oft verwendet, um zu einem bestimmten Teil der Seite zu springen
ein Zielwert:
1. Integrierter Name:
_blank (neue Seite wird geöffnet) _top (oberste Seite wird geöffnet, muss mit iframe verwendet werden) _parent (auf der Seite auf der vorherigen Ebene öffnen) _self (die aktuelle Seite wird geladen, dieser Wert ist der Standardwert)
2. Der Programmierer benennt es selbst:
Name des Fensters (Sie Sie können einen Namen für das Fenster angeben, um das angegebene Fenster zu öffnen.) Der Name des IFrames zum Öffnen des Downloads im angegebenen IFrame. Die Funktion besteht darin, die Seite herunterzuladen, die nicht häufig verwendet wird.
2. Verwendung des img-Tags
Funktion: Eine Get-Anfrage senden und ein Bild anzeigen
Attribute:
alt: Definiert die alternative Textbeschreibung des Bildes. Höhe: Die Höhe des Bildes. Breite: Die Breite des Bildes src: Die URL des Bildes. Dieses Attribut ist für das a1f02c36ba31691bcfe87b2722de723b-Element erforderlich.
Responsives Schreiben:
Zum Beispiel maximale Breite: 100 %
Austauschbares Element:
ist ein austauschbares Element. Der Standardwert seiner Anzeigeeigenschaft ist inline, aber seine Standardauflösung wird durch die ursprüngliche Breite und Höhe des eingebetteten Bildes bestimmt, sodass es sich wie ein Inline-Block verhält. Sie können die CSS-Eigenschaften border/border-radius, padding/margin, width, height usw. für festlegen. Es gibt keine Grundlinie, was bedeutet, dass bei Verwendung von Vertical-Align: Baseline in einem Inline-Formatierungskontext der untere Rand des Bildes an der Textgrundlinie des Containers ausgerichtet wird.
3. Die Verwendung des Tabellen-Tags
stellt tabellarische Daten dar – also Informationen, die durch eine zweidimensionale Datentabelle dargestellt werden. Dies ist relativ einfach
(Lernvideo-Sharing:
HTML-Video-Tutorial) Das Folgende ist der Beispielcode
<caption>Color names and values</caption> <tbody> <tr> <th scope="col">Name</th> <th scope="col">HEX</th> <th scope="col">HSLa</th> <th scope="col">RGBa</th> </tr> <tr> <th scope="row">Teal</th> <td><code>#51F6F6</code></td> <td><code>hsla(180, 90%, 64%, 1)</code></td> <td><code>rgba(81, 246, 246, 1)</code></td> </tr> <tr> <th scope="row">Goldenrod</th> <td><code>#F6BC57</code></td> <td><code>hsla(38, 90%, 65%, 1)</code></td> <td><code>rgba(246, 188, 87, 1)</code></td> </tr> </tbody> </table>
Eigenschaften:
align: Diese Aufzählungseigenschaft gibt an, wie im Dokument enthaltene Tabellen ausgerichtet werden müssen. Es gibt folgende Werte: left, die Tabelle wird auf der linken Seite des Dokuments angezeigt; centre, die Tabelle wird in der Mitte des Dokuments angezeigt; right, die Tabelle wird auf der rechten Seite des Dokuments angezeigt
Rahmen: definiert die Größe des Tabellenrandes. Wenn es auf 0 gesetzt ist, bedeutet dies, dass das Frame-Attribut auf leer gesetzt ist. Wenn der Wert auf 1 gesetzt ist, hat die Tabelle einen 1-Pixel-Rand.
**cellpadding:** Dieses Attribut definiert den Abstand zwischen dem Inhalt und dem Rand der Tabellenzelle.
**Zellenabstand: ** Dieses Attribut definiert (in Prozent oder Pixeln) die Größe des Abstands zwischen zwei Zellen
**Breite: ** Dieses Attribut definiert die Breite der Tabelle. Die Breite kann ein Pixel oder ein Prozentwert sein, und der Prozentwert der Breite wird als Breite des Tabellencontainers definiert.
border-collapse: Grenzen zusammenführen
border-spacing: 0; Randabstand ist auf 0 gesetzt
table { Tabellenlayout: auto; border-collapse: Zusammenbruch; Randabstand: 0; }
4. Andere Gedanken
Das ist nicht schwer, aber man muss sich viele Dinge merken und weiter hart arbeiten! ! !
——————Ein Teil der Textinformationen stammt von MDN und Hungry Man Valley
Verwandte Empfehlungen:
HTML-TutorialDas obige ist der detaillierte Inhalt vonSo verwenden Sie wichtige und schwierige Tags in HTML. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!