CSS -Breite passen Inhalt

Die CSS -Breite definiert die Breite des Inhaltsbereichs des Elements. Dieser Bereich ist der Raum zwischen Rand, Polsterung und Rand eines Elements. Darüber hinaus die CSS -Breite mit dem Wert “PassformPasst die Breite des Elements entsprechend dem Inhalt ein.

Diese Studie erläutert die Eigenschaft der CSS-Breite mit dem Value Fit-Incontent.

So verwenden Sie die CSS-Breiteneigenschaft mit dem Wert von Fit-In-Incontent-Wert?

Zum Zwecke der Verwendung von CSS-Breiteneigenschaft mit einem Anpassungswert finden Sie in der angegebenen Syntax:

Breite: Passform

Beispiel

Fügen Sie in HTML drei Divelemente mit demselben Klassennamen hinzu “Kasten"Und drei verschiedene Klassen"Farbe-1","Farbe-2", Und "Color-3", bzw. Hinzufügen

Element in jedem DIV, um der Webseite Inhalte hinzuzufügen:

CSS -Breite passen Inhalt

Hallo Welt!

Die Teamarbeit beginnt mit dem Aufbau von Vertrauen. Wir sind ein Team, das für eine gemeinsame Mission arbeitet.

Hier ist die Ausgabe des HTML -Code:

Bisher haben wir die HTML -Seite besprochen. Im nächsten Abschnitt werden wir nun verschiedene CSS -Stile auf die HTML -Elemente anwenden, damit sie besser aussehen. Im laufenden Beispiel werden wir das Verhalten der “überprüfen“Breite"Eigenschaft mit dem Wert"Passform”Im CSS.

Stil „Box“ div

.Kasten
Breite: Passform;
Höhe: 50px;
Farbe: Ghostwhite;
Polsterung: 6px;
Rand: 2px;
Schriftgröße: 18px;

Der ".Kasten”Bezieht sich auf die Div -Class -Box. Im Folgenden finden Sie die Eigenschaften, die darauf angewendet werden:

• • “Breite”Eigenschaft mit dem Wert“Passform”Verwendet den verfügbaren Speicherplatz, aber er wird den Inhalt nicht überschreiten.
  • “HöheIst die Eigenschaft, die die Höhe des Elements bestimmt.
  • “Farbe”Definiert die Schriftfarbe des Elements.
  • “PolsterungDie Eigenschaft erzeugt Platz im Rand des Elements oder um den Inhalt.
  • “Rand”Bestimmt Raum um das Element.
  • “SchriftgrößeEigenschaft bestimmt die Schriftgröße.

Stil „color-1“ div

.color-1
Hintergrundfarbe: #00abb3;

Der "Hintergrundfarbe”Eigenschaft ist auf die“ eingestellt “.Farbe-1”Div.

Stil „color-2“ div

.color-2
Hintergrundfarbe: #083aa9;

Stil „Color-3“ div

.color-3
Hintergrundfarbe: #4c6793;

Es kann beobachtet werden, dass die Breite des Elements gleich dem Inhalt festgelegt ist:

Das ist großartig! Wir haben erfolgreich die Verwendung des CSS gelernt “Breite”Eigenschaft mit dem Wert“Passform”.

Abschluss

Mit der CSS -Breiteneigenschaft können wir mehrere Werte verwenden. Diese Werte sind in Prozent, Pixel oder mehr. Um es nach dem Inhalt festzulegen, die “Passform"Wert kann festgelegt werden. Dieser Beitrag hat die CSS-Breite Eigenschaft mit dem Wertverpassen mit einer praktischen Demonstration beschrieben.