IE6/7 wird ein Chaos: Problem mit der Höhe leerer Textknoten

IE6/7 wird ein Chaos: Problem mit der Höhe leerer Textknoten
Vorwort:

Verwenden Sie die Debugleiste, um den Dokumentcode in IETester anzuzeigen. In jedem ul li gibt es diesen Text: leerer Textknoten, einige sind in span, in … Mit einem Wort, unter dem li muss einer sein, manchmal gibt es mehr als einen. Normalerweise gibt es kein Problem. Heute ist mir etwas Unglückliches passiert. Ich habe gesehen, dass der Text: leerer Textknoten bei Verwendung des Layouts eine Höhe hatte, und diese war nicht die Höhe des li, sondern 4px höher als die angezeigte Höhe des li. Für den vorherigen Absatz ist dieses 1px schmerzhaft, geschweige denn 4px. Dieser Typ hat mich lange verwirrt.

Denken Sie an die Übersetzung: Text: Leerer Textknoten. Wenn er leer ist, warum hat er dann eine Höhe? Ich habe online gesucht, aber keine entsprechende Erklärung gefunden.

Ich habe den CSS-Code gepostet, lasst uns ihn gemeinsam untersuchen. Ich habe font-size:0px in li hinzugefügt; obwohl es das Problem gelöst hat, möchte ich die Experten dennoch bitten, einige Gründe zu nennen!

Code kopieren
Der Code lautet wie folgt:

.sidebar_menu{width:225px; Listenstil:keine; Position:relative;}
.sidebar_menu li{ Zeilenhöhe: 34px; Breite: 225px; Höhe: 35px;<SPAN style="COLOR: #ff0000">Schriftgröße: 0px;</SPAN> Position: relativ;}
.sidebar_menu li span{ Anzeige: Block; Breite: 225px; Höhe: 34px; Überlauf: ausgeblendet; Rahmen unten: 1px durchgezogen #007ac7;}
.sidebar_menu li span a { ​​width:225px;text-align:left;text-indent:35px;display:block; font:14px/34px Arail,"Microsoft YaHei";color:#333; background:#c3e1f4;}

Einen Screenshot hochladen

Dieses Bild ist in IETester sehr gut zu sehen. Klicken Sie auf Layout, um den Text anzuzeigen: leerer Textknoten.

<<:  MySQL-Platzhalter (erweiterte SQL-Filterung)

>>:  Detaillierte Einführung in die Linux-Hostnamenkonfiguration

Artikel empfehlen

Tutorials der MySQL-Reihe für Anfänger

Inhaltsverzeichnis 1. Grundkonzepte und Grundbefe...

Tutorial zur Installation und Konfiguration von Hbase unter Linux

Inhaltsverzeichnis Hbase-Installation und -Konfig...

Layout im Vue.js-Stil Allgemeine Fähigkeiten zur Flutter-Geschäftsentwicklung

Korrespondenz zwischen Flutter und CSS im Shadow-...

Design-Referenz: Erfolgsbeispiel für die Erstellung einer WordPress-Website

Jede dieser 16 Sites ist eine sorgfältige Lektüre ...

Vollständige Schritte zum Implementieren des Standort-Punch-Ins mithilfe räumlicher MySQL-Funktionen

Vorwort Die Projektanforderung besteht darin, fes...

Einfache Schritte zum Schreiben benutzerdefinierter Anweisungen in Vue3.0

Vorwort Vue bietet eine Fülle integrierter Anweis...

So begrenzen Sie die Anzahl der Datensätze in einer Tabelle in MySQL

Inhaltsverzeichnis 1. Lösung auslösen 2. Partitio...

Detaillierte Erläuterung verschiedener Möglichkeiten zum Abrufen der PID (TID, LWP) von Linux-Threads

In Linux C/C++ werden Operationen auf Thread-Eben...

HTML+CSS+JavaScript zum Erstellen eines einfachen Tic-Tac-Toe-Spiels

Inhaltsverzeichnis Implementieren von HTML CSS hi...

Mehrere Methoden und Vor- und Nachteile der Implementierung eines dreispaltigen Layouts mit CSS

Vorwort Das dreispaltige Layout ist, wie der Name...

JS asynchroner Code Unit-Test Magie Promise

Inhaltsverzeichnis Vorwort Verkettung von Verspre...

Implementierung eines schwebenden Werbestreifens in HTML und CSS

1.html Teil Code kopieren Der Code lautet wie folg...

Detaillierte Erläuterung des Aufbaus und der Schnittstellenverwaltung des Docker Private Warehouse

1. Über die Registrierung Der offizielle Docker-H...

Beispielcode zur Implementierung von Dreiecken und Pfeilen durch CSS-Rahmen

1. CSS-Boxmodell Die Box beinhaltet: Rand, Rahmen...

Detaillierte Erläuterung des Prozesses zur Bereitstellung von Tomcat und zur Erstellung des ersten Webprojekts in IDEA 2020.3.1

Inhaltsverzeichnis Tomcat-Einführung Tomcat-Berei...