Heim > Artikel > Web-Frontend > So verwenden Sie das CSS-Anzeigeattribut
So verwenden Sie das CSS-Anzeigeattribut
- silencementOriginal
- 2019-05-26 16:45:493825Durchsuche
Definition und Verwendung von Anzeigeattributen
Das Anzeigeattribut wird häufig im Webseitenlayout verwendet und hat viele Attributwerte, aber das Die am häufigsten verwendeten Attributwerte sind „Block“, „Inline-Block“, „Inline“ und „Keine“. Daher konzentrieren wir uns hier auf die Verwendung dieser häufig verwendeten Attributwerte > In CSS wird das Anzeigeattribut verwendet, um den Boxtyp zu definieren, den ein Element generieren soll. Es wird häufig verwendet, um Blockelemente in Inline-Elemente, Inline-Elemente in Blockelemente oder Blockelemente/Inline-Elemente in Inline-Blockelemente umzuwandeln und das Inline-Block-Element haben sowohl die Eigenschaften von Blockelementen als auch die Eigenschaften von Inline-Elementen.
Anzeigeattribut-Syntaxformat1.css-Syntax: display:none/inline/block/inline-block/list-item/run-in/table/inline -table/table-row-group/table-header-group/table-footer-group/table-row/table-colume-group/table-column/table-cell/table-caption/inherit
2. JavaScript-Syntax: object.style.display="inline"
keine: Legen Sie fest, dass das Element nicht angezeigt wird
block: Legen Sie das Element als Element auf Blockebene fest.
inline: Legen Sie das Element als Inline-Element fest.
inline-block: Inline-Blockelement, das die Eigenschaften von Blockelementen aufweist und Inline-Elemente. Funktionen
list-item: Element als Liste festlegen
run-in: Je nach Kontext als Blockebenenelement oder Inline-Element anzeigen
kompakt /marker: Bereits aus CSS2 entfernt.
Tabelle in 1 löschen: Legen Sie das Element auf eine Tabelle auf Blockebene fest (ähnlich wie f5d188ed2c074f8b944552db028f98a1), mit Zeilenumbrüchen vor und nach der Tabelle
inline-table: Setzt das Element auf eine Inline-Tabelle (ähnlich wie < ;table>), es gibt keine Zeilenumbrüche vor und nach der Tabelle
table-row-group: Setzt das Element auf eine Gruppe von eine oder mehrere Zeilen (ähnlich wie 92cee25da80fac49f6fb6eec5fd2c22a)
table-header-group: Ähnlich wie ae20bdd317918ca68efdc799512a9b39
table-footer-group: Ähnlich wie 06669983c3badb677f993a8c29d18845 ; Tabellenzeile: Ähnlich wie das Tag
, kein Attribut des Anzeigeattributs, wenn der Attributwert des Anzeigeattributs des Elements valuefestgelegt ist Keine, das Element wird ausgeblendet und nicht angezeigt, und es wird vom Dokumentfluss getrennt und belegt nicht den sehr verwandten Platz auf der Webseite: Anzeige und CSS-versteckte Elemente Verwendungshinweise für Sichtbarkeitsattribute
Beispiel<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>display属性的none属性值</title>
<style type="text/css">
body{background-color: #aaa;}
.div{width:400px;height:60px;border:1px solid;margin-top:10px;}
.none{display:none;}
</style>
</head>
<body>
<div class="div">元素1</div>
<div class="div none">元素2</div>
<div class="div">元素3</div>
</body>
</html>
Das obige ist der detaillierte Inhalt vonSo verwenden Sie das CSS-Anzeigeattribut. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!