Lösung zur inkonsistenten Anzeige der Cursorgröße im Eingabefeld

Die Cursorgröße im Eingabefeld ist inkonsistent

Der Unterschied zwischen IE7 und Chrome ist sehr offensichtlich

Schauen wir uns zunächst die Ursache des Problems an: Der Chrome-Browser legt die Cursorhöhe nach folgendem Prinzip fest: Wenn kein Inhalt vorhanden ist, ist die Cursorhöhe = der Wert der Zeilenhöhe der Eingabe; wenn Inhalt vorhanden ist, bewegt sich der Cursor vom oberen Rand der Eingabe zum unteren Rand des Textes.

OK, jetzt, da wir den Grund kennen, werden wir entsprechende Maßnahmen ergreifen. Habe es auf zwei Arten versucht:.

Methode 1: Stellen Sie den Zeilenhöhenwert auf den gleichen Wert wie die Schriftgröße ein. Wenn die Höhe nicht erreicht wird, verwenden Sie eine Polsterung, um dies zu unterstützen.

Methode 2: Legen Sie für Chrome keine Zeilenhöhe fest, da der Text dann automatisch zentriert wird. Legen Sie für IE einen Zeilenhöhenwert fest, um sicherzustellen, dass der Text vertikal zentriert ist. Beachten Sie hier, dass, wenn Zeilenhöhe und andere Werte in der Datei zum Zurücksetzen des Stils festgelegt sind, die Zeilenhöhe zurückgesetzt werden muss. Sie können Zeilenhöhe:normal verwenden. Weitere Einzelheiten finden Sie im Suchfeld auf der Tencent Hollywood-Seite.

Spezifisches CSS:

Code kopieren

Der Code lautet wie folgt:

Höhe: 34px;
Schriftgröße: 12px;
Zeilenhöhe: normal;
Zeilenhöhe: 34px\9;

<<: Erfahren Sie mehr über die am häufigsten verwendeten JavaScript-Ereignisse

>>: So verpacken Sie das Docker-Image, übertragen es auf den Remote-Server und stellen es auf k8s bereit

Informationen zur Installationsmethode für MySQL 8.0.13-ZIP-Pakete

Artikel

So erstellen (CREATE PROCEDURE) und rufen (CALL) Sie eine gespeicherte MySQL-Prozedur auf und so erstellen (DECLARE) und weisen (SET) Sie eine Variable zu

Artikel

Durchführung der lokalen Migration von Docker-Images

Lösung zur inkonsistenten Anzeige der Cursorgröße im Eingabefeld

Informationen zur Installationsmethode für MySQL 8.0.13-ZIP-Pakete

So erstellen (CREATE PROCEDURE) und rufen (CALL) Sie eine gespeicherte MySQL-Prozedur auf und so erstellen (DECLARE) und weisen (SET) Sie eine Variable zu

Durchführung der lokalen Migration von Docker-Images

Methoden und Schritte zum Upgrade von MySql5.x auf MySql8.x

Installationshandbuch für VMware Workstation 15 Pro (für Anfänger)

Detaillierte Schritte zur Installation und Konfiguration von MySQL 8.0 auf CentOS

Vue echarts realisiert die dynamische Anzeige von Balkendiagrammen

Eine kurze Diskussion darüber, ob CSS-Animationen durch JS blockiert werden

Detaillierte Erklärung zur Verwendung von Router-View-Komponenten in Vue

So konfigurieren Sie Java-Umgebungsvariablen im Linux-System

Artikel empfehlen

Detaillierte Erklärung der Sperrstruktur in MySQL

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

Detaillierte Erläuterung der Installationsmethode von Mysql 5.7.18 und des Prozesses zum Starten des MySQL-Dienstes

Detaillierte Erläuterung der Schritte zur Konfiguration des Centos7-Bridge-Netzwerks unter VMware

Der Prozess des Erstellens und Konfigurierens der Git-Umgebung in Docker

MySql schnelles Einfügen von zig Millionen großen Datenbeispielen

Die Darstellung und Öffnungsmethode eines Hyperlinks

Eine Screenshot-Demo basierend auf Canvas in HTML

So zeigen Sie im Hintergrund laufende Programme in Linux an und schließen sie

CentOS7-Bereitstellung Flask (Apache, mod_wsgi, Python36, venv)

So implementieren Sie die Paging-Funktion des MyBatis-Interceptors

Grafisches Tutorial zum Herunterladen, Installieren und Konfigurieren von MySQL 8.0.22.0

JavaScript implementiert die asynchrone Übermittlung von Formulardaten

Detaillierter Vergleich von Ember.js und Vue.js

Die häufigsten Fehler beim Schreiben von HTML-Tags