Verständnis von Haslaylout- und BFC-Parsing
|
1. haslayout und bfc sind IE-spezifische und Standardattribute. 2. BFC ist ein isolierter, unabhängiger Container auf der Seite. Die untergeordneten Elemente im Container wirken sich nicht auf die Elemente außerhalb aus und umgekehrt. 3. BFC hat 3 Funktionen: 1. Enthält schwebende Elemente, 2. Überschneidungen beim Drehbuchschreiben vermeiden, 3. Verhindern Sie, von schwebenden Elementen verdeckt zu werden 4. Auslösebedingungen: Float-Wert ungleich None Überlaufwerte außer sichtbar (versteckt, automatisch, scrollen) Anzeige (Tabellenzelle, Tabellenüberschrift, Inline-Block, Flex, Inline-Flex) Der Positionswert ist (absolut, fest) Das Fieldset-Element Es ist wichtig zu beachten, dass BFC ein unabhängiger Container ist, der andere Layouts nicht beeinflusst und auch nicht beeinflusst wird. Durch die Verwendung seiner Eigenschaften können Sie Probleme wie das Löschen von Floats und 2-Spalten-Layouts lösen. Beispiel: 2-spaltiges adaptives Layout 1. Lösen Sie es mit Floating und negativem Rand 2. BFC auslösen und nicht von schwebenden Elementen abgedeckt werden |
<<: Implementierung eines CSS-Textschatten-Effekts zur allmählichen Unschärfe
>>: Grundlagen der HTML-Bearbeitung (ein Muss für Anfänger)
Artikel empfehlen
Probleme bei der Verwendung der Rich-Text-Bearbeitung mit Wangeditor in Vue
wangEditor ist ein webbasierter Rich-Text-Editor,...
Implementierung von Single-Div-Zeichentechniken in CSS
Sie können häufig Artikel über das Zeichnen mit C...
Verschiedene Probleme und Lösungen beim Bereitstellen von Tomcat zur Veröffentlichung von Projekten unter Linux
Bereitstellen des Projekts in der Testumgebung de...
Beispiel für das Schreiben von mobilem H5 zum Aufrufen einer APP (IOS, Android)
iOS 1. URL-Schema Diese Lösung ist grundsätzlich ...
So optimieren Sie eine Website, um die Zugriffsgeschwindigkeit zu erhöhen Update
Vor Kurzem hat das Unternehmen damit begonnen, al...
Nginx: Lernen, wie man einen Dienst zum Schutz von Datei-Hotlinks erstellt – Beispiel
Vorwort Jeder weiß, dass viele Websites mittlerwe...
So verwenden Sie Linux-Befehle zum Konvertieren und Zusammenfügen von Audioformaten
Installieren Sie FFmpeg flac eric@ray:~$ sudo apt...
Verwenden Sie CSS3, um den Code für dynamische Spezialeffekte beim Hovern von Schaltflächen zu implementieren
Wir haben vorgestellt, wie man mit den CSS3-Spalt...
Beispieloperation für die Summe des Mysql-Varchar-Typs
Einige Freunde haben beim Erlernen von Datenbanke...
Drei Möglichkeiten zur Implementierung von Animationen in CSS3
Hiermit werden die Grundkenntnisse des Interviewt...
Grundlegende Verwendung von @Font-face und wie man es mit allen Browsern kompatibel macht
@Font-face grundlegende Einführung: @font-face ist...
Detaillierte Erläuterung der Leistungsoptimierung für MySQL-Batch-SQL-Einfügungen
Bei einigen Systemen mit großen Datenmengen beste...
So verwenden Sie die Wurmreplikation in einer MySQL-Datentabelle
Einfach ausgedrückt besteht die MySQL-Wurmreplika...
Die perfekte Lösung für das MySql-Versionsproblem sql_mode=only_full_group_by
1. Überprüfen Sie sql_mode wählen Sie @@sql_mode ...
Lösung für die Nichterreichbarkeit des Tencent Cloud Server Tomcat-Ports
Ich habe vor Kurzem einen Server mit Tencent Clou...