Sublime/vscode – schnelle Implementierung zur Generierung von HTML-Code

Sublime/vscode – schnelle Implementierung zur Generierung von HTML-Code

Grundlegende HTML-Struktur

Eingabe !+Eingabe

<!DOCTYPE html>
<html lang="de">
<Kopf>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=Gerätebreite, Anfangsmaßstab=1.0">
    <meta http-equiv="X-UA-kompatibel" content="ie=edge">
    <title>Dokument</title>
</Kopf>
<Text>
    
</body>
</html>

Generieren Sie Tastenkombinationen für Div plus Klassennamen

Geben Sie div.list>div.item_$*6 ein

<div Klasse="Liste">
    <div Klasse="Artikel_1"></div>
    <div Klasse="Artikel_2"></div>
    <div Klasse="Artikel_3"></div>
    <div Klasse="Artikel_4"></div>
    <div Klasse="Artikel_5"></div>
    <div Klasse="Artikel_6"></div>
</div>

Div mit Klassennamen

Geben Sie div.wrapper ein

<div Klasse="Wrapper"></div>

div mit ID

div#Wrapper

<div id="wrapper"></div>

Eigentum[]

Spanne[Titel="Test"]

<span Titel="Test"></span>

Nachkommen>

Geben Sie div>span>a ein

<div><span><a href=""></a></span></div>

Brüder+

div+p+spanne

<div></div>
<p></p>
<span></span>

Überlegen^

div>span^i

<div><span></span></div>
<i></i>

Multiplikation*

ul>li*2

<ul>
    <li></li>
    <li></li>
</ul>

Text{}

div>span{das ist ein Test}

<div><span>das ist ein Test</span></div>

Selbstinkrementsymbol $

ul>li.list_${list $}*3

<ul>
    <li class="list_1">Liste 1</li>
    <li class="list_2">Liste 2</li>
    <li class="list_3">Liste 3</li>
</ul>

ul>li.item$@3*3 „@3“ (zeigt an, dass die Zählung bei 3 beginnt)

<ul>
    <li class="item3">Liste 1</li>
    <li class="item4">Liste 2</li>
    <li class="item5">Liste 3</li>
</ul>

Implizite Konvertierung

.Klasse

<div Klasse="Klasse"></div>

ul>.Artikel

<ul>
    <li Klasse="Artikel"></li>
</ul>

Tabelle>.Zeile>.Spalte

<Tabelle>
    <tr Klasse="Zeile">
        <td class="col"></td>
    </tr>
</Tabelle>

Dies ist das Ende dieses Artikels zum schnellen Generieren von HTML-Code in Sublime/VSCode. Weitere Informationen zum schnellen Generieren von HTML in VSCode finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, Sie werden 123WORDPRESS.COM auch in Zukunft unterstützen!

<<:  Beispielcode zum Anzeigen einer Bildlaufleiste nach dem Verkleinern der HTML-Seite

>>:  Implementierung des HTML-Gleit- und Schwebeball-Menüeffekts

Artikel empfehlen

Sortierung und Paginierung von MySQL-Abfragen

Überblick Da wir die Daten normalerweise nicht di...

Detaillierte Erklärung des Unterschieds und der Anwendung von CSS3-Filtern: Schlagschattenfilter und Box-Shadow

Um mit Standard-CSS3 den Schatteneffekt eines Ele...

Lösung für die Meldung „Die exklusive Sperre dieser Konfigurationsdatei ist fehlgeschlagen“ auf der virtuellen VMware-Maschine

Nach einem abnormalen Herunterfahren von VMware w...

Methode zum Schreiben von bedingten Kommentaren und Beispielcode

Als Front-End-Ingenieure müssen wir mit dem IE ve...

Detaillierte Erläuterung der Vorgehensweise bei der Installation des Permeate-Range-Systems mit VMware

1. Hintergrund Wir führen von Zeit zu Zeit intern...

Detaillierte Erläuterung der Sicherung und Wiederherstellung von PSSQL-Datenbanken in Docker

1. Postgres-Datenbanksicherung in Docker Befehl: ...

Beispiel für die Verwendung des Supervisors zum Verwalten von Nginx+Tomcat-Containern

brauchen: Verwenden Sie Docker, um den Dualprozes...

Vue+Swiper realisiert Timeline-Effekt

In diesem Artikel wird der spezifische Code von v...

Detaillierte Erläuterung der Verwendung von MySQL-Profilen zur Analyse von langsamem SQL (Group Left Join ist effizienter als Unterabfrage)

Verwenden Sie ein Profil, um langsames SQL zu ana...

HTML-Textfeld (Text) ist nicht in mehreren Möglichkeiten verfügbar, um schreibgeschützt zu erreichen

Methode 1: <input id= "File1" type= &...

Ausführliches Tutorial zur Installation von MySql 5.6.35 winx64

Hinweis: Beim Projektstart ist kein Fehler aufgru...

Umfassendes Verständnis des MySQL-Protokolls für langsame Abfragen

Inhaltsverzeichnis Was ist das Protokoll langsame...

Beispielcode zur Implementierung der Formularvalidierung mit reinem CSS

In unserem täglichen Geschäft ist die Formularval...

HTML+VUE-Paging zur Realisierung einer coolen IoT-Großbildfunktion

Wirkung demo.html <html> <Kopf> <m...

HTML implementiert die Funktion zum automatischen Aktualisieren oder Öffnen eines neuen Fensters für den URL-Link des Elements href

Manchmal möchten wir eine solche Funktion impleme...