Tipps zur Verwendung von DIV-Containern mit fester Höhe in IE6 und IE7
|
Es gibt viele Unterschiede zwischen IE6 und IE7 in ihrer Interpretation von CSS. Heute sprechen wir über einen davon: die Höhe. Beispiel: Code kopieren Der Code lautet wie folgt: <div Stil="Höhe:50px"> Unter IE6: Wenn die Inhaltshöhe im DIV 50 Pixel nicht überschreitet, beträgt die Höhe des DIV 50 Pixel. Wenn sie den eingestellten Wert überschreitet, wird die Höhe mit dem Inhalt erweitert, was normalerweise als adaptive Höhe bezeichnet wird. Unter IE7: Wenn die Höhe des Inhalts im DIV 50 Pixel nicht überschreitet, beträgt die Höhe des DIV 50 Pixel. Wenn der festgelegte Wert überschritten wird, bleibt die Höhe des DIV weiterhin auf 50 Pixel festgelegt, und der überschüssige Inhalt überschreitet das DIV und läuft über. Wenn sich unter dem DIV anderer Inhalt befindet, überlappt dieser den überlaufenden Inhalt. Dies ist offensichtlich ein sehr wichtiger Punkt. Wenn er nicht beachtet wird, führt dies zu Seitenunordnung. Normalerweise gibt es zwei Möglichkeiten, dieses Problem zu lösen: 1. Konzentrieren Sie sich auf die Höhe: Legen Sie die Höhe des DIV auf 50 Pixel fest, verbergen Sie den zusätzlichen Inhalt und schreiben Sie das CSS für beide Browser wie folgt: Code kopieren Der Code lautet wie folgt: <div Stil="Höhe:50px;Überlauf:versteckt"> overflow:hidden ist sehr wichtig, die Kompatibilität hängt davon ab2. Inhaltsorientiert: Stellen Sie die minimale DIV-Höhe auf 50 Pixel ein. Wenn zu viel Inhalt vorhanden ist, passt sich die DIV-Höhe dem Inhalt an. Zu diesem Zeitpunkt ist CSS HACK erforderlich, um einige Kompatibilitätsverarbeitungen durchzuführen: <div style="min-height:50px;_height:50px;">, min-height:50px Mindesthöhe, dies können IE7 und FF erkennen, _height:50px ist unterstrichen, damit es nur von IE6 erkannt wird. |
>>: Der neueste Linux-Installationsprozess von Tomcat8
Artikel empfehlen
So konfigurieren Sie geplante MySQL-Aufgaben (EVENT-Ereignisse) im Detail
Inhaltsverzeichnis 1. Was ist eine Veranstaltung?...
Implementierungsschritte zum Erstellen einer MySQL Master-Slave-Replikationsumgebung basierend auf Docker
1. Einleitung Die bisherige Programmarchitektur k...
Lernunterlagen zum Schreiben des ersten Vue-Programms
Inhaltsverzeichnis 1. Schreiben Sie ein HTML, das...
Die tdwidth-Einstellung der Tabelle in mehreren Divs ist gleich und kann nicht ausgerichtet werden
Kürzlich habe ich festgestellt, dass selbst wenn d...
Lösung für den 1045-Fehler in der MySQL-Datenbank
Wie löst man das Problem 1045, wenn die lokale Da...
Detaillierte Erklärung zur korrekten Installation von OpenCV auf Ubuntu
Dieser Artikel beschreibt, wie man OpenCV mit C++...
Detaillierte Erklärung von MySQL-Transaktionen und MySQL-Protokollen
Transaktionale Merkmale 1. Atomarität: Nach dem S...
Richtige Schritte zur Installation von Nginx unter Linux
Vorwort Wenn Sie wie ich ein fleißiger Java-Backe...
Eine kurze Diskussion über die Ausführungsreihenfolge von JavaScript-Makrotasks und Mikrotasks
Inhaltsverzeichnis 1. JavaScript ist Single-Threa...
Detaillierte Erläuterung zum Erreichen einer hohen Verfügbarkeit von Eureka durch Docker und Docker-Compose
In letzter Zeit wurden in neuen Projekten Springc...
JavaScript-Verlaufsobjekt erklärt
Inhaltsverzeichnis 1. Routennavigation 2. API zur...
Warum sollte CSS im Head-Tag platziert werden?
Denken Sie darüber nach: Warum sollte css im head...
Detaillierte Erklärung der Vue-Ereignisbehandlung und Ereignismodifikatoren
<div id="Wurzel"> <h2>Mach ...
Analyse und Lösung des durch Chrome 73 verursachten Flex-Layout-Zusammenbruchs
Phänomen Es gibt mehrere verschachtelte Flex-Stru...