Gilt das Verschachteln eines `` innerhalb eines ``-Elements als korrektes HTML?-CSS-Tutorial-php.cn

Is Nesting a `` Inside a `` Element Considered Correct HTML?

Ist es richtig, ein

zu verschachteln? Innerhalb eines Element?

In Bootstrap ist es üblich, horizontale Formen zu verwenden. Allerdings könnte es notwendig sein, die Erstellung von IDs für jede -Komponente zu vermeiden. Element. Um dieses Problem zu umgehen, erwägen einige die Verschachtelung eines

innerhalb eines mit einer benutzerdefinierten CSS-Klasse, um zu erzwingen, dass es sich wie ein Blockelement verhält.

Im Einzelnen demonstriert der folgende Code diesen Ansatz:

<form class="form-horizontal" role="form">
  <div class="form-group">
    <label class="block">
      <span class="col-lg-2 control-label">Email</span>
      <div class="col-lg-10">
        <input type="email" class="form-control">
      </div>
    </label>
  </div>
</form>

Nach dem Login kopieren

Und das benutzerdefinierte CSS:

.block {
  display: block;
}

Nach dem Login kopieren

Der richtige Ansatz

Gemäß der HTML-Spezifikation ist ein Das Element darf kein

enthalten. Element. Aus der Spezifikation:

"Inhaltsmodell:
Formulierungsinhalt, aber ohne untergeordnete beschriftbare Elemente, es sei denn, es handelt sich um das beschriftete Steuerelement des Elements, und ohne untergeordnete Beschriftungselemente."

Bezieht sich auf den Formulierungsinhalt auf Text und Elemente, die Text auf der Ebene innerhalb eines Absatzes markieren, darunter , , und und andere.

ist nicht in dieser Liste enthalten. Daher ist das Verschachteln eines innerhalb eines gilt als falsches HTML. Dies kann zu unerwartetem Verhalten oder Validierungsfehlern führen. Das obige ist der detaillierte Inhalt vonGilt das Verschachteln eines `` innerhalb eines ``-Elements als korrektes HTML?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle：php.cnVorheriger Artikel：Wie kann ich Div-Elemente mit mehreren Klassennamen abfragen? Nächster Artikel：Wie erhalte ich Mausklickkoordinaten relativ zu einem Zielelement in jQuery? Erklärung dieser Website Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn Neueste Artikel des Autors Antonblast: Alle Sammelorte von The Big Bath 2024-12-21 08:56:09 E-Mail-Validierung mit Python automatisieren: Eine Schritt-für-Schritt-Anleitung 2024-12-21 08:54:09 Wie kann ich Endlosschleifen verhindern, die durch falsche Datentypeingaben in C verursacht werden? 2024-12-21 08:53:09 Was ist der Unterschied zwischen den Punkt- (.) und Pfeil- (->) Operatoren in C? 2024-12-21 08:52:10 Wie erstellt und verwaltet das Python-Schlüsselwort „yield' Generatoren? 2024-12-21 08:51:09 Wie finde ich den ersten Tag einer Woche anhand der Wochennummer in MySQL? 2024-12-21 08:50:08 Wie kann ich die Extraktion der Versionsnummer aus .dtsx-Dateien automatisieren? 2024-12-21 08:49:09 Neues PostgreSQL ORM für Golang: Enterprise 2024-12-21 08:48:10 Wie kann ich Dateien in Java umbenennen und an sie anhängen? 2024-12-21 08:47:11 Wie kann ich Klassen- und ID-Selektoren in CSS kombinieren, um auf bestimmte HTML-Elemente abzuzielen? 2024-12-21 08:46:11 Aktuelle Ausgaben function_exists() kann die benutzerdefinierte Funktion nicht ermitteln Funktionstest () {Verwendung der Verwendung durch -Durch -Durch -Durch -Durch -Durch -Durc... Aus 2024-04-29 11:01:01 0 3 2252 So zeigen Sie die mobile Version von Google Chrome an Hallo Lehrer, wie kann ich Google Chrome in eine mobile Version umwandeln? Aus 2024-04-23 00:22:19 0 11 2389 Das untergeordnete Fenster bedient das übergeordnete Fenster, aber die Ausgabe antwortet nicht. Die ersten beiden Sätze sind ausführbar, der letzte Satz jedoch nicht. Aus 2024-04-19 15:37:47 0 1 2003 Im übergeordneten Fenster erfolgt keine Ausgabe document.onclick = function(){ window.opener.document.write('Ich bin die Ausgabe des unter... Aus 2024-04-18 23:52:34 0 1 1890 Wo gibt es die Kursunterlagen zum CSS-Mindmapping? Kursunterlagen Aus 2024-04-16 10:10:18 0 0 1956 verwandte Themen Mehr> Konfigurieren Sie Java-Umgebungsvariablen Was ist ein Servomotor? So speichern Sie Dateien auf einem USB-Laufwerk Handy-Bildschirm tft Der Computer fordert zur Lösung des NSIS-Fehlers auf Methoden zur Reparatur von Datenbankschwachstellen Verwendung der Ortszeitfunktion ostringstream-Nutzung

Beliebte Empfehlungen So stellen Sie CSS so ein, dass es die Anzeigeellipsen überschreitet So legen Sie die Schriftgröße in CSS fest So verwenden Sie Hover in CSS So legen Sie den Zeichenabstand in CSS fest Was sind die neuen Funktionen von CSS3? Beliebte Tutorials Mehr> Verwandte Tutorials Beliebte Empfehlungen Aktuelle Kurse Das neueste Video-Tutorial zur Weltpremiere von ThinkPHP 5.1 (60 Tage zum Online-Schulungskurs zum PHP-Experten) 1423521 PHP-Einführungs-Tutorial eins: Lernen Sie PHP in einer Woche 4269071 JAVA-Video-Tutorial für Anfänger 2539123 Das nullbasierte Einführungsvideo-Tutorial von Little Turtle zum Erlernen von Python 507675 PHP Zero-basiertes Einführungs-Tutorial 862930 Das neueste Video-Tutorial zur Weltpremiere von ThinkPHP 5.1 (60 Tage zum Online-Schulungskurs zum PHP-Experten) 1423521 Lernzeiten JAVA-Video-Tutorial für Anfänger 2539123 Lernzeiten Das nullbasierte Einführungsvideo-Tutorial von Little Turtle zum Erlernen von Python 507675 Lernzeiten Kurze Einführung in die Web-Frontend-Entwicklung 215885 Lernzeiten Meistern Sie PS-Video-Tutorials von Grund auf 890639 Lernzeiten [Web-Frontend] Node.js-Schnellstart 7501 Lernzeiten Vollständige Sammlung ausländischer Full-Stack-Kurse zur Webentwicklung 5988 Lernzeiten Gehen Sie zur praktischen Anwendung von GraphQL 4946 Lernzeiten Der 550-W-Lüftermeister lernt Schritt für Schritt JavaScript von Grund auf 699 Lernzeiten Python-Meister Mosh, ein Anfänger ohne Grundkenntnisse, kann in 6 Stunden loslegen 24885 Lernzeiten Neueste Downloads Mehr> Web-Effekte Quellcode der Website Website-Materialien Frontend-Vorlage [Formular-Schaltfläche] Kontaktcode für das jQuery-Enterprise-Nachrichtenformular [Spezialeffekte für Spieler] Wiedergabeeffekte für HTML5-MP3-Spieluhren [Menünavigation] HTML5 coole Partikelanimations-Navigationsmenü-Spezialeffekte [Formular-Schaltfläche] Drag-and-Drop-Bearbeitungscode für visuelle jQuery-Formulare [Spezialeffekte für Spieler] VUE.JS imitiert den Kugou-Musik-Player-Code [HTML5-Spezialeffekte] Klassisches HTML5-Pushing-Box-Spiel [Bildspezialeffekte] jQuery-Scrollen zum Hinzufügen oder Reduzieren von Bildeffekten [Fotoalbumeffekte] Persönlicher CSS3-Albumcover-Hover-Zoom-Effekt [Frontend-Vorlage] Website-Vorlage für Reinigungs- und Reparaturdienste für Inneneinrichtungen [Frontend-Vorlage] Persönliche Lebenslauf-Leitfaden-Seitenvorlage in frischen Farben [Frontend-Vorlage] Web-Vorlage für kreativen Job-Lebenslauf für Designer [Frontend-Vorlage] Website-Vorlage eines modernen Ingenieurbauunternehmens [Frontend-Vorlage] Responsive HTML5-Vorlage für Bildungseinrichtungen [Frontend-Vorlage] Vorlage für die Website eines Online-E-Book-Shops für Einkaufszentren [Frontend-Vorlage] IT-Technologie löst Website-Vorlage für Internetunternehmen [Frontend-Vorlage] Website-Vorlage für Devisenhandelsdienste im violetten Stil [PNG material] 可爱的夏天元素矢量素材(EPS+PNG) [PNG material] 四个红的的 2023 毕业徽章矢量素材(AI+EPS+PNG) [Banner image] 唱歌的小鸟和装满花朵的推车设计春天banner矢量素材(AI+EPS) [PNG material] 金色的毕业帽矢量素材(EPS+PNG) [PNG material] 黑白风格的山脉图标矢量素材(EPS+PNG) [PNG material] 不同颜色披风和不同姿势的超级英雄剪影矢量素材(EPS+PNG) [Banner image] 扁平风格的植树节banner矢量素材(AI+EPS) [PNG material] 九个漫画风格的爆炸聊天气泡矢量素材(EPS+PNG) [Frontend-Vorlage] Website-Vorlage für Reinigungs- und Reparaturdienste für Inneneinrichtungen [Frontend-Vorlage] Persönliche Lebenslauf-Leitfaden-Seitenvorlage in frischen Farben [Frontend-Vorlage] Web-Vorlage für kreativen Job-Lebenslauf für Designer [Frontend-Vorlage] Website-Vorlage eines modernen Ingenieurbauunternehmens [Frontend-Vorlage] Responsive HTML5-Vorlage für Bildungseinrichtungen [Frontend-Vorlage] Vorlage für die Website eines Online-E-Book-Shops für Einkaufszentren [Frontend-Vorlage] IT-Technologie löst Website-Vorlage für Internetunternehmen [Frontend-Vorlage] Website-Vorlage für Devisenhandelsdienste im violetten Stil