Heim > Web-Frontend > CSS-Tutorial > Hauptteil

Detaillierte Erläuterung der gegenseitigen Beeinflussung von Anzeige-/Float-/Positionsattributwerten in CSS

高洛峰
Freigeben: 2017-03-04 09:57:12
Original
1895 Leute haben es durchsucht

Es gibt drei Eigenschaften im Zusammenhang mit der Layout- und Boxerstellung: „display“, „position“ und „float“, die wie folgt miteinander interagieren:

Wenn der Wert von „display“ ist „none“, dann haben „position“ und „float“ keine Auswirkung. In diesem Fall wird keine Box generiert.

Ansonsten Wenn der Wert „Position“ „absolut“ oder „fest“ ist, ist die Box absolut positioniert und der berechnete Wert von „Float“ ist es „none“, der Wert von „display“ wird wie unten gezeigt festgelegt. Die Position der Box wird durch die Eigenschaften „top“, „right“, „bottom“ und „left“ und den enthaltenden Block bestimmt.

Andernfalls Wenn der Wert von „float“ nicht „none“ ist, wird das Feld „float“ und der Wert von „display“ wird wie unten gezeigt festgelegt.

Andernfalls Wenn das Element das Stammelement ist, wird der Wert von „display“ wie folgt festgelegt (mit Ausnahme des durch list-item angegebenen Werts, der wird als „Block“ oder „Listenelement“ berechnet, undefiniert in CSS2.1 )

Ansonsten in anderen Fällen der Wert von „display“. Das Attribut ist der Wert, den es angibt.

Detaillierte Erläuterung der gegenseitigen Beeinflussung von Anzeige-/Float-/Positionsattributwerten in CSS

wobei Inline-Flex und Flex neue Attributwerte sind, die vom CSS3-Modul für elastisches Layout eingeführt wurden.

Zusammenfassend wird das Anzeigeattribut von Inhaltselementen in Containern mit absoluter Positionierung, flexiblem Layout und Rasterlayout blockiert.

Der obige Artikel erläutert kurz die gegenseitige Beeinflussung von Anzeige-/Float-/Positionsattributwerten in CSS. Dies ist der gesamte vom Herausgeber geteilte Inhalt Ich hoffe auch, dass jeder die chinesische PHP-Website unterstützt.

Ausführlichere Erläuterungen zum gegenseitigen Einfluss von Anzeige-/Float-/Positionsattributwerten in CSS finden Sie auf der chinesischen PHP-Website für verwandte Artikel!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage