Kleine Details der Web-Frontend-Entwicklung
|
1 Das Select-Tag muss geschlossen sein <select></select> 2 Beim Layout links und rechts können Sie eine Seite schweben lassen, die Breite der schwebenden Seite festlegen und den Rand der anderen Seite auf die Breite der schwebenden Seite + den tatsächlichen Rand einstellen, wie unten gezeigt: .oben .oben_links{Breite:250px; Float:links; Höhe:500px;} .oben .oben_rechts{Höhe:500px; Rand links:260px;} Dies führt jedoch zu einem 3px-Fehler in IE6. Sie können einen Hack verwenden, nämlich *margin-left:257px; am besten lassen Sie .top_right auch schweben, damit der 3px-Fehler behoben wird, d. h. doppelter Float für die Breiteneinstellung 3 Wenn die Breite des Containers kleiner als die Breite des Inhalts eingestellt ist, wird er in modernen Browsern normal angezeigt, und der Inhalt, der die Breite überschreitet, kann weiterhin angezeigt werden, und der Container wird nicht erweitert. Dies ist jedoch in IE6 nicht der Fall, da die Breite in IE6 die Mindestbreite ist, sodass der Container gestreckt wird und die absolute relative Positionierung und der Rand basierend auf diesem Container Probleme verursachen. Die Lösung besteht darin, die Breite des Containers nicht festzulegen oder die Breite so einzustellen, dass sie größer oder gleich der maximalen Breite des Inhalts ist. 4 !important Der folgende Code: #a{margin-left:30px!wichtig; margin-left:20px;} Im obigen Beispiel beträgt der linke Rand der Ebene A in IE6.0 20 Pixel, während er in Firefox 30 Pixel beträgt. Dies liegt daran, dass !important in CSS Priorität bedeutet. Da der IE dieses Attribut nicht erkennen kann, kann im IE nur die Option „margin-left:20px;“ aufgerufen werden. Daher wird derselbe Code in Firefox und IE in unterschiedlichen Stilen angezeigt. 5 Kompatibilität-------3px-Fehler am unteren Rand des li-Elements in IE6/7 Wenn ein li in IE6 und 7 ein schwebendes Element enthält, hat das li einen zusätzlichen unteren Rand von 3 Pixeln. Es gibt zwei Lösungen: 1: Fügen Sie li ein Float-Attribut hinzu. Der Attributwert kann jeder beliebige Wert außer keinem sein. 2. Fügen Sie das Attribut „vertical-align“ zu li hinzu. Der Attributwert kann ein beliebiger Wert sein. In Bezug auf die Lösung des Problems gibt es zwischen diesen beiden Methoden keinen Unterschied. Beide Methoden stimulieren das Haslayout von li, indem entsprechende CSS-Attribute hinzugefügt werden. Methode 2 ist jedoch besser geeignet, um dieses Problem zu lösen, da Floating, sobald es zu li hinzugefügt wird, gelöscht werden muss. Dies ist ein kniffliges Problem. Obwohl es viele Möglichkeiten gibt, die durch Floating verursachten Probleme zu lösen, erhöht es unsichtbar die Belastung des Codes, was wir nicht sehen möchten, daher wird Methode 2 empfohlen. 6 Oft stößt man auf ein Layout, bei dem zwei Divs links und rechts gleich hoch sind. Beide Divs haben ihre Höhe festgelegt, aber die Höhe eines Divs wird in IE6 gestreckt. Das liegt daran, dass die in IE6 festgelegte Höhe der Mindesthöhe entspricht, während die in FF festgelegte Höhe der Mindesthöhe entspricht und daher von IE6 gestreckt wird. Die Lösung besteht darin, dem Div „overflow: hidden“ hinzuzufügen. |
<<: Detaillierte Erklärung der benutzerdefinierten Ereignisse von Vue-Komponenten
>>: Eine kurze Diskussion über das Design des Tomcat-Mehrschichtcontainers
Artikel empfehlen
Win10 Installation Linux System Tutorial Diagramm
Um eine virtuelle Maschine auf einem Windows-Syst...
Detailliertes Tutorial zur Installation von Docker auf CentOS 7.5
Einführung in Docker Docker ist eine Open-Source-...
Detaillierte Erklärung zur Verwendung von INS und DEL zum Markieren von Dokumentänderungen
ins und del wurden in HTML 4.0 eingeführt, um Auto...
UTF-8- und GB2312-Webkodierung
In letzter Zeit haben mich viele Studenten zur Ko...
Einstellungen für den Ubuntu-Boot-Autostart-Dienst
So erstellen Sie einen Dienst und starten ihn aut...
CSS verwendet die BEM-Namenskonvention
Welche Informationen möchten Sie erhalten, wenn S...
Detaillierte Erklärung zur Verwendung von Echarts-Maps in Angular
Inhaltsverzeichnis Initialisierung von Echart App...
Grafisches Tutorial zum Herunterladen und Installieren von MySQL 5.7 und höher
1. Herunterladen 1. Download-Adresse der offiziel...
Natives JS zum Erstellen eines verschiebbaren Anmeldefelds
Dieser Artikel zeigt ein verschiebbares Anmeldefe...
HTML-Tutorial: Sammlung häufig verwendeter HTML-Tags (6)
Verwandte Artikel: Anfänger lernen einige HTML-Ta...
So installieren und konfigurieren Sie einen FTP-Server in CentOS8.0
Nach der Veröffentlichung von CentOS8.0-1905 habe...
Beispiele für die korrekte Verwendung von AES_ENCRYPT() und AES_DECRYPT() zum Verschlüsseln und Entschlüsseln von MySQL
Vorwort Kürzlich stieß ich bei der Arbeit auf ein...
Implementierung der Lese-/Schreibtrennung und des Lastenausgleichs von MySQL basierend auf OneProxy
Einführung Teil 1: Am Anfang geschrieben OneProxy...
So erweitern Sie die Festplattengröße einer virtuellen Maschine
Nachdem Vmvare die Festplattengröße der virtuelle...