Inline CSS | Erklärt

Inline CSS | Erklärt
Cascading Style Sheets alias CSS ist eine Sprache, mit der Elemente einer HTML -Webseite gestaltet werden, um die Schönheit von Webseiten zu verbessern. CSS ist recht einfach und kann Ihnen viel Zeit sparen, indem Sie die Bildung vieler Webseiten gleichzeitig bearbeiten. Damit CSS funktionieren, müssen Sie Ihr Stylesheet in Ihr HTML -Dokument aufnehmen.

Es gibt drei mögliche Möglichkeiten, Ihr Stylesheet zu Ihrem HTML -Dokument hinzuzufügen

  1. Externes CSS
    External CSS ist ein Stylesheet, das in einer separaten Datei definiert ist und in einem HTML -Dokument als Link mit enthalten ist .CSS -Erweiterung.
  2. Interne CSS
    Interne CSS wird in demselben HTML -Dokument unter Verwendung des Elements im Abschnitt definiert.
  3. Inline CSS
    Inline CSS wird auch in demselben HTML -Dokument unter Verwendung des Stilattributs eines Elements definiert. In diesem Tutorial werden wir jedoch Inline -CSS ausführlich besprechen…

Inline CSS

Um ein einzelnes HTML -Element zu stylen, wird der Inline -CSS -Ansatz verwendet. Diese Technik verwendet das Style -Attribut eines HTML -Tags, um CSS zu enthalten. Die im Style -Attribut angegebene Stildefinition wirkt nur dieses bestimmte Element aus.

Syntax

Lassen Sie uns die Inline -CSS -Technik mit Hilfe einiger Beispiele untersuchen und verstehen.

Beispiel 1

Angenommen, Sie möchten stylen

Element mit Inline -CSS.




Inline CSS.



Im obigen Beispiel haben wir das Style -Attribut des

Markieren Sie, um die Überschrift mit dem folgenden Code zu stylen.

Inline CSS.

Ausgang

Wir setzen die Farbe der Überschrift in Purpur, Schriftfamilie auf „Times New Roman“ und Textausrichtung in die Mitte.

Beispiel 2

Im obigen Beispiel haben wir ein einfaches Textstück mit Inline -CSS gestaltet. Im folgenden Beispiel werden wir A mit Inline -CSS stylen.





Dieses Beispiel zeigt die Verwendung von Inline -CSS.

Im obigen Beispiel setzen wir die Polsterung, den Rand und die Hintergrundfarbe des Elements mit dem folgenden Code-Stück.


Dieses Beispiel zeigt die Verwendung von Inline -CSS.

Ausgang

So können Sie Elemente wie oder stylen können

Verwenden Sie den Inline -CSS -Ansatz.

Nachdem wir das Konzept in Bezug.

Vorteile von Inline -CSS
Hier haben wir einige Vorteile von Inline -CSS aufgelistet.

  • Sie können ein Element einzeln stylen.
  • Es verringert die Anzahl der Dateien, die der Browser herunterladen muss.
  • Es ist für kleine Webprojekte geeignet.

Nachteile von Inline -CSS
Hier haben wir einige Nachteile von Inline -CSS aufgelistet.

  • Inline -CSS kann Ihren Code weniger überschaubar machen.
  • In Inline CSS werden Dateien nicht zwischengespeichert.
  • Die mit Inline -CSS angegebenen Stildefinitionen sind nicht wiederverwendbar.
  • Pseudocodes und Klassen können nicht mit Inline -CSS gestylt werden.
  • Es ist nicht geeignet für größere Projekte, da es die Schaufensterheit des Codes verringert.

Abschluss

Inline CSS ist eine Technik, die Style -Blätter in ein HTML -Dokument mit dem Style -Attribut des Elements einbezieht. Inline CSS ermöglicht es dem Benutzer, Elemente einzeln zu stylen, und die angegebene Stildefinition wirkt sich nur auf dieses bestimmte Element aus. In diesem Beitrag wurde die Inline -CSS -Technik mit Hilfe geeigneter Beispiele ausführlich erörtert. Darüber hinaus werden Vor- und Nachteile der zu diskutierten Technik hervorgehoben.