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

Detaillierte Erklärung zu Drag-Time und Drag-Case in JavaScript

SSM-Projekte werden häufig als War-Pakete bereitgestellt, wobei Tomcat und Maven zur Implementierung der Hot-Deployment-Konfiguration verwendet werden.

Hintergrund Wie wir alle wissen, müssen wir nach ...

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

Detaillierte Erklärung zu Drag-Time und Drag-Case in JavaScript

JavaScript zum Erreichen eines dynamischen Farbwechsels der Tabelle

Detaillierte Erklärung zur Verwendung von HTML-Einbettungs-Tags und -Attributen

Grundlegende Verwendung von Unterabfragen in MySQL

Tutorial zur Installation von VMware, Nmap und Burpsuite

Installieren Sie das Linux-System automatisch basierend auf Cobbler

Zwei Möglichkeiten, die CSS-Priorität zu verstehen

Eine einfache Möglichkeit, das Passwort in MySQL 5.7 zu ändern

Referenzen und Referenzdetails in Vue3

js, um einen einfachen Karusselleffekt zu erzielen

Artikel empfehlen

Detaillierte Erklärung der Startbefehle für Docker-Versionen es, milvus und minio

Tutorial zur Verwendung des iostat-Befehls unter Linux

Docker-Installations- und Konfigurationsschritte für MySQL

Beispiele für MySQL-Batch-Hinzufügungs- und Speichermethoden

Detaillierte Erläuterung verschiedener Möglichkeiten zum Erstellen von Objekten und Objektmethoden in js

Apache Log4j2 meldet eine Sicherheitslücke auf Nuklearebene und eine schnelle Lösung

SSM-Projekte werden häufig als War-Pakete bereitgestellt, wobei Tomcat und Maven zur Implementierung der Hot-Deployment-Konfiguration verwendet werden.

Was sind HTML-Inline-Elemente und Block-Level-Elemente und ihre Unterschiede

Grafisches Tutorial zur Installation von MySQL 5.5 unter Win7

Schritte zur Implementierung des cuda10.1-Treibers bei der Installation von Ubuntu

Detaillierte Erläuterung des Prinzips und der Verwendung von MySQL-gespeicherten Prozeduren

Eine kurze Diskussion über die Ausführungsdetails der Mysql Multi-Table Join-Abfrage

Lösung für das Problem, dass die gesamte Seite nicht zentriert ist, wenn margin:0 auto in HTML verwendet wird

Detaillierte Erklärung des Unterschieds zwischen Tags und Elementen in HTML

CSS Sticky Footer-Implementierungscode