Kleines Problem mit dem Abstand zwischen Label und Eingabe im Google Browser

Erst Code, dann Text

Code kopieren

Der Code lautet wie folgt:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<Kopf>
<meta http-equiv="Inhaltstyp" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>
<Stil>
div {Breite: 500px; Höhe: 500px; Rand: 0 auto; Rahmen: #000 durchgezogen 1px;}
Beschriftung { Anzeige: Inline-Block; Breite: 100px; Rahmen: #000 durchgezogen 1px;}
Eingabe { Rahmen: #000 durchgezogen 1px;}
</Stil>
</Kopf>
<Text>
<div>
<p><label>Konto</label><input type="text" /></p>
<p><label>Passwort</label><input type="text" /></p>
<p>
<label>Bestätigungscode</label>
<input Typ="Text" /><img src="" Breite="100" Höhe="20" />
</p>
</div>
</body>
</html>

Das Öffnen von Google hat folgende Auswirkungen

Der Abstand zwischen Beschriftung und Eingabe des Bestätigungscodes ist offensichtlich größer als die beiden oben genannten. Nachdem der Zeilenumbruch des Bestätigungscodes entfernt und in eine Zeile umgewandelt wurde, werden die drei Eingabefelder ausgerichtet. Der Grund ist noch unbekannt.

PS: Ich habe bereits geschrieben, dass img und input nicht ausgerichtet sind. Fügen Sie ihnen einfach vertical-align:middle hinzu.

<<: Informationen zur Verwendung von Keepalived zum Erreichen eines automatischen Neustarts von Nginx und einer hohen Verfügbarkeit von Dual Active Hot Standby

>>: Lösung für Indexfehler, die durch implizite MySQL-Typkonvertierung verursacht werden

Div kann Inhalte eingeben, ohne die Eingabe als Eingabefeld zu verwenden, um den automatischen Eingabestil zu blockieren

Kleines Problem mit dem Abstand zwischen Label und Eingabe im Google Browser

Div kann Inhalte eingeben, ohne die Eingabe als Eingabefeld zu verwenden, um den automatischen Eingabestil zu blockieren

Vergessen Sie nicht, den HTML-Tag zu schließen

Zusammenfassung der XHTML-Anwendung im Webdesign-Studium

Umfassendes Verständnis der Überwachung von HTML-Formulareingaben

Tastenkombinationsvorgang für SQL Server-Kommentare

CentOS 7.9 Installations- und Konfigurationsprozess von zabbix5.0.14

So passen Sie CSS an den Vollbildmodus des iPhone an

Unterschiede zwischen MySQL CHAR und VARCHAR beim Speichern und Lesen

Einführung in die Verwendung und Deaktivierung von Transparent Huge Pages in Linux

Manuelle Implementierung der Instanceof-Methode in JavaScript

Artikel empfehlen

MySQL-Tabellenübergreifende Abfrage und Tabellenübergreifende Aktualisierung

Verschaffen Sie sich ein umfassendes Verständnis des Prototypobjekts in JavaScript

12 Arten der Komponentenkommunikation in Vue2

Tutorial zu HTML-Tabellen-Tags (8): Hintergrundbild-Attribut BACKGROUND

So führen Sie .sh-Dateien im Linux-System aus

MySQL 8.x MSI-Version Installations-Tutorial mit Bildern und Text

Detaillierte Erläuterung der nahtlosen horizontalen LVM-Festplattenerweiterung basierend auf Linux

Angular Dependency Injection erklärt

Lösen Sie das Installationsproblem von Linux Tensorflow2.0

Detaillierte Erklärung des Responsive-Prinzips von Vue3

N Möglichkeiten, adaptive Teiler geschickt mit CSS zu implementieren

Zusammenfassung der Linux-Befehle zur Dateiverzeichnisverwaltung

Wie können die Transaktionseigenschaften von MySQL InnoDB sichergestellt werden?

Countdown-Effekt mit Javascript implementieren

Beispielcode für CSS-Stacking und Z-Index