Heim > Artikel > Web-Frontend > Wie lege ich die Div-Größe mit CSS fest?
Wie lege ich die Div-Größe mit CSS fest?
- 藏色散人Original
- 2021-04-26 09:08:232624Durchsuche
So legen Sie die Div-Größe mit CSS fest: Erstellen Sie zuerst eine HTML-Beispieldatei, erstellen Sie dann ein Div im Textkörper und legen Sie schließlich die Breiten- und Höhenattribute für das Div fest.
Die Betriebsumgebung dieses Artikels: Windows7-System, HTML5- und CSS3-Version, Dell G3-Computer.
In HTML ist das div-Tag-Element ein Blockelement, das die Größe (Breite und Höhe) des Elements festlegen kann. Wie richtet man es also ein? Der folgende Artikel wird es Ihnen vorstellen und ich hoffe, dass er Ihnen hilfreich sein wird.
Lassen Sie uns zunächst etwas über Blockelemente lernen.
Das repräsentative Blockelement ist div. Andere wie p, nav, aside, header, footer, section, Article, ul-li, address usw. können alle mit verwendet werden div. erreichen. Um Programmierern jedoch die Interpretation des Codes zu erleichtern, werden im Allgemeinen bestimmte semantische Tags verwendet, um den Code besser lesbar und einfacher auf Fehler zu überprüfen.
Blockelementfunktionen:
1. Höhe, Zeilenhöhe, Ränder und Abstand können alle gesteuert werden.
2. Beginnen Sie immer in einer neuen Zeile und belegen Sie eine ganze Zeile, das heißt, es kann automatisch Zeilen umbrechen.
3. Es kann Inline-Elemente und andere Blockelemente aufnehmen.
4. Die Bandbreite entspricht immer der Browserbreite, unabhängig vom Inhalt.
5. Mehrere Blockelement-Tags werden zusammengeschrieben und die Standardanordnung ist von oben nach unten.
In CSS können Sie die Attribute width und height verwenden, um die Div-Größe festzulegen. Das width-Attribut legt die Breite des Elements fest und das height-Attribut legt die Höhe des Elements fest.
Die Attribute width und height definieren die Breite und Höhe des Inhaltsbereichs des Elements. Pads, Ränder und Ränder können außerhalb des Inhaltsbereichs hinzugefügt werden.
Beispiel: <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
div{
border: 1px solid red;
}
.box{
width: 300px;
height: 100px;
}
</style>
</head>
<body>
<div>普通div</div><br />
<div class="box">设置宽度为300px，高度为100px的div</div>
</body>
</html>Rendering:
Das obige ist der detaillierte Inhalt vonWie lege ich die Div-Größe mit CSS fest?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!