Manchmal kann es schwierig sein, Websites zu entwerfen, die auf verschiedenen Geräten gut aussehen. HTML bietet mehrere Eigenschaften, um die Größe und Position des Elements festzulegen, um einige reaktionsschnelle Probleme zu lösen. Die häufigsten Eigenschaften sind die “Breite" Und "Höhe”. Diese Eigenschaften werden verwendet, um die Größe des Elements anzugeben. Darüber hinaus können wir die Eigenschaften der MAX-Höhe, der max.

Dieser Beitrag wird abdecken:

• So stellen Sie die maximale Höhe des Elements mit CSS ein?
• So stellen Sie die minimale Höhe des Elements mit CSS ein?
• So stellen Sie die minimale Breite des Elements mit CSS ein?
• So stellen Sie die maximale Breite des Elements mit CSS ein?

Voraussetzung: HTML -Datei erstellen

Erstellen Sie zunächst eine HTML -Datei, indem Sie den unten genannten Schritten folgen:

• Füge hinzu ein ""Element mit dem Klassennamen"hauptsächlich”.
• In diesem Bereich fügen Sie zwei hinzu “"Elemente mit dem Klassennamen"Layout-Img" Und "Layout-Inhalt", bzw.
• Das "" -Element mit der Klasse "Layout-IMG" enthält das ""Element, das mit dem verbunden ist"srcAttribut, das die URL des Bildes und die “angibtBreite”Attribut, um die Breite des Elements zu definieren.
• Das "" Element mit "Layout-Inhalt"Hält eine"

  " Und "

  Elemente für die Überschrift und den Absatz.

Hier ist der HTML -Code:

Lerne mit uns

Die Eigenschaft "Breite" wird verwendet, um die Breite des Elements festzulegen.
Die Eigenschaft "Höhe" wird verwendet, um die Höhe des Elements festzulegen.

Im kommenden Abschnitt werden wir lernen, die Höhe und Breite der HTML -Elemente mit CSS zu bestimmen.

Stil „Haupt“ -Klasse

Erstens, Zugang zur Hauptsache “"Container mit Hilfe des Klassenattributs".hauptsächlich”. Wenden Sie dann die folgenden CSS -Eigenschaften an:

.hauptsächlich
Breite: 300px;
Höhe: 360px;
Rand: Auto;
Schriftgröße: 20px;
Grenze: 1PX Solid RGB (237, 234, 234);
Border-Radius: 20px;
Hintergrundfarbe: RGB (235, 235, 235);

Hier sind die CSS -Styling -Eigenschaften, die auf der Hauptdivation angewendet werden:

• “Breite”Bestimmt die Breite des Elements.
• “Höhe”Legt die Größe des Elements fest.
• “Rand”Fügt Räume auf jeder Seite des Elements hinzu.
• “Schriftgröße”Passt die Schriftgröße an.
• “GrenzeDie Eigenschaft wird angewendet, um einen Rand um das Element zu setzen. Es hält die Werte für die Grenzbreite, den Stil und die Farbe.
• “Grenzradius”Eigenschaft macht die Kanten des Elements rund.
• “Hintergrundfarbe”Wendet die Hintergrundfarbe des Elements an.

Ausgang

Stil „Layout-in-in-in-in-in-in-in-“ -Klasse

.Layout-Inhalt
Polsterung: 0 10px;
Hintergrundfarbe: RGB (233, 179, 112);

Die "" Klasse haben "Layout-Inhalt”Ist mit dem" gestaltet "PolsterungEigenschaft, die Platz um den Inhalt des Elements hinzufügt.

Ausgang

So stellen Sie die maximale Höhe des Elements in CSS ein?

Der "maximale HöheEigenschaft bestimmt die maximale Höhe des Elements. Der Inhalt überflutet, wenn er die maximale Höhe überschreitet.

Geben Sie in CSS die maximale Höhe des „“ Elements mit einem “anLayout-Inhalt"Klasse, indem Sie das angeben"maximale Höhe" Eigentum:

maximalhöhe: 100px;

Ausgang

So stellen Sie die minimale Höhe des Elements in CSS ein?

Der "min-hoheDie Eigenschaft passt die minimale Höhe des Elements an. Es wird angewendet, wenn der Inhalt des Elements geringer ist als die Mindesthöhe. Es hat keine Auswirkung, wenn der Inhalt die Minenhöhe überschreitet.

Ergänzen Sie die "min-hohe"Eigentum der Klasse"Layout-Inhalt”Um die minimale Höhe des Elements anzugeben:

min-hohe: 100px;

Ausgang

So stellen Sie die minimale Breite des Elements in CSS ein?

Das CSS “MinweiteEigenschaft bestimmt die minimale Breite des Elements. Der "MinweiteWird auf das Element angewendet, wenn der Inhalt geringer ist als die minimale Breite des Elements. Es zeigt keine Auswirkung, wenn der Inhalt die Mindestbreite überschreitet.

Ergänzen Sie die "MinweiteEigentum an der Klasse „Layout-Inhalt“, um zu sehen, wie sich dies auswirkt:

Min-Width: 310px;

Ausgang

So stellen Sie die maximale Breite des Elements in CSS ein?

CSS “maximale BreiteDie Eigenschaft wird verwendet, um die maximale Breite des Elements zu bestimmen. Wir können sagen, dass es eine feste Elementbreite hat. Wenn der Inhalt die Breite des Elements überschreitet. Infolgedessen ändert sich die Höhe automatisch.

Ergänzen Sie die "maximale Breite”Eigenschaft mit dem Wert“230pxUm seine Wirkung zu sehen:

Max-Breite: 230px;

Ausgang

Wir haben gelernt, wie man die Breite und Höheneigenschaften der Elemente mit CSS angibt.

Abschluss

So setzen Sie die Höhe und Breite des HTML -Elements, das CSS “Höhe" Und "BreiteEigenschaften werden verwendet. Diese CSS “Minweite","maximale Breite","min-hohe", Und "maximale HöheEigenschaften werden verwendet, um die Breite und Höhe des Elements relativ zum übergeordneten Element zu begrenzen. Dieser Artikel hat die Methoden zur Begrenzung der Größe des Elements unter Verwendung der CSS -Eigenschaften gezeigt.