Heim > Web-Frontend > CSS-Tutorial > Hauptteil

Welche Werte hat die Anzeige?

百草
Freigeben: 2023-11-20 17:28:15
Original
2716 Leute haben es durchsucht
<p>Zu den Anzeigewerten gehören Block, Inline, Keine, Inline-Block, Flex, Raster, Tabelle, Inline-Tabelle und Listenelement usw. Detaillierte Einführung: 1. Block, der Elemente in Elemente auf Blockebene umwandelt, bildet einen Block auf der Seite und belegt nur eine Zeile. 2. Inline, wodurch Elemente in Inline-Elemente umgewandelt werden. Inline-Elemente belegen keine eigene Zeile und können neben anderen Elementen stehen. 3. Keine, dieser Wert gibt an, dass das Element nicht auf der Seite usw. sein wird.

<p>Welche Werte hat die Anzeige?

<p>Das Betriebssystem dieses Tutorials: Windows 10-System, DELL G3-Computer.

In CSS, display-Attribut wird verwendet, um den Anzeigetyp des Elements zu bestimmen. Es kann viele verschiedene Werte haben, hier sind einige der wichtigsten: none; Tab-Größe: 4; Hintergrundfarbe: rgba(27, 31, 35, 0,05);">display Attributwert: display属性用于确定元素的显示类型。它可以有多种不同的值,以下是一些主要的display属性值:

<p>1、block:将元素渲染为块级元素。块级元素在页面上形成一个块,并且独占一行。例如,<div><p><h1>-<h6>以及<li>

1. block: Rendern Sie das Element als Element auf Blockebene. Elemente auf Blockebene bilden einen Block auf der Seite und belegen eine eigene Zeile. Zum Beispiel: , <p>, <h1>-<h6> und <li> sind alle Standardelemente auf Blockebene. 🎜<p>2. Inline: Elemente als Inline-Elemente rendern. Inline-Elemente belegen selbst keine Zeile und können neben anderen Elementen platziert werden. Zum Beispiel: , <code class=" inline" style="box-sizing: border-box padding: 1px 4px -webkit-font-smoothing: antialiased; Schriftfamilie: SFMono-Regular, Consolas, „Liberation Mono“, Rand: 0px 2px; Hintergrundfarbe: rgba(27, 31, 35 , 0,05); border-radius: 3px;"><a> usw. sind alles Standard-Inline-Elemente. <span><a>等都是默认的内联元素。

<p>3、none:此值指定元素不会在页面上显示。它与visibility: hidden不同,因为使用visibility: hidden的元素仍然会占据页面空间,而使用display: none

<p>3. keine: Dieser Wert gibt an, dass das Element nicht auf der Seite angezeigt wird. Es ist dasselbe wie visibility: versteckt ist anders, weil visibility: hide-Elemente belegen weiterhin Platz auf der Seite und verwenden display: none Elemente werden vollständig aus dem Layout entfernt.

<p>4. Inline-Block: Elemente als Inline-Block-Level-Elemente rendern. Das Merkmal von Inline-Elementen auf Blockebene besteht darin, dass sie wie Inline-Elemente nebeneinander sitzen, aber die Breite und Höhe festlegen können und wie Elemente auf Blockebene ihre eigenen Abmessungen haben.

🎜5. Flex🎜: Elemente als flexible Boxmodelle rendern. Das Flexbox-Modell ist eine CSS-Layouttechnik zum Anordnen, Ausrichten und Verteilen von Raum innerhalb eines eindimensionalen Raums (Zeilen oder Spalten). 🎜<p>6. Raster: Elemente in Rastercontainer rendern. Rastercontainer legen den Raum in zwei Dimensionen (Zeilen und Spalten) an, richten ihn aus und verteilen ihn.

<p>7. Tabelle: Elemente in Tabellen rendern. Dieser Wert wurde hauptsächlich zur Anzeige tabellarischer Daten verwendet, wird jedoch nicht mehr häufig verwendet, da die moderne CSS-Technologie flexiblere Layoutmethoden bietet.

<p>8. Inline-Tabelle: Elemente als Inline-Tabellen rendern. Eine Inline-Tabelle ähnelt einem Inline-Element auf Blockebene, weist jedoch die Merkmale einer Tabelle auf, z. B. Ränder und Abstand zwischen Zellen.

<p>9. Listenelement: Elemente als Listenelemente rendern. Bei Verwendung dieses Werts erscheint das Element als Element in der Liste, mit Standardaufzählungszeichen oder Nummerierung.

Zusätzlich zu den oben genannten wichtigen display属性值,还有一些其他的取值,如 run-incompactmarkerusw., aber in der modernen Webentwicklung ist die Verwendung dieser Werte nicht üblich. In den meisten Fällen werden die oben genannten Hauptwerte die meisten Layoutanforderungen erfüllen.

Das obige ist der detaillierte Inhalt vonWelche Werte hat die Anzeige?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

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
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!