TechCodeview

CSS (Cascading Style Sheet) beschreibt die HTML-Elemente, die angezeigt werden Bildschirm, Papier , oder in andere Medien . Es spart viel Zeit. Es steuert das Layout mehrerer Webseiten gleichzeitig. Es legt fest Schriftgröße, Schriftfamilie, Farbe, Hintergrundfarbe auf der Seite.

Es erlaubt uns, etwas hinzuzufügen Auswirkungen oder Animationen zur Website. Wir gebrauchen CSS anzuzeigen Animationen wie Tasten, Effekte, Lader oder Spinner , und auch animierte Hintergründe .

Ohne zu benutzen CSS , wird die Website nicht attraktiv aussehen. Es gibt 3 Arten von CSS die unten aufgeführt sind:

• Inline-CSS
• Internes/eingebettetes CSS
• Externes CSS

1. Internes CSS

Das interne CSS hat Tag in der Abschnitt der HTML dokumentieren. Dieser CSS-Stil ist eine effektive Möglichkeit, einzelne Seiten zu gestalten. Die Verwendung des CSS-Stils für mehrere Webseiten ist zeitaufwändig, da die Platzierung erforderlich ist Stil auf jeder Webseite.

Wir können das interne CSS verwenden, indem wir die folgenden Schritte ausführen:

1. Öffnen Sie zunächst die HTML Seite und suchen Sie die

2. Fügen Sie den folgenden Code nach dem ein

3. Fügen Sie die hinzu Regeln von CSS in der neuen Zeile.

Beispiel:

 body { background-color: black; } h1 { color: white; padding: 50px; } 

4. Schließen Sie das Style-Tag.

Nach dem Hinzufügen des internen CSS sieht die vollständige HTML-Datei wie folgt aus:

 body { background-color: black; } h1 { color: red; padding: 50px; } <h2>CSS types</h2> <p>Cascading Style sheet types: inline, external and internal</p> 

Wir können auch die Selektoren verwenden (Klasse und ID) im Stylesheet.

Beispiel:

 .class { property1 : value1; property2 : value2; property3 : value3; } #id { property1 : value1; property2 : value2; property3 : value3; } 

Vorteile von internem CSS

Internes CSSWenn wir den Code mit der HTML-Seite hinzufügen, können wir nicht mehrere Dateien hochladen.

Nachteile von internem CSS:

• Hinzufügen von Code in der HTML Dokument wird die reduzieren Seitengröße Und Ladezeit der Webseite.

2. Externes CSS

Im externen CSS verlinken wir die Webseiten mit den externen .css Datei. Es wird erstellt von Texteditor . CSS ist eine effizientere Methode zum Gestalten einer Website. Durch Bearbeiten der .css Datei können wir die gesamte Website auf einmal ändern.

Um das externe CSS zu verwenden, führen Sie die folgenden Schritte aus:

1. Erstellen Sie ein neues .css Datei mit Texteditor , und hinzufügen Kaskadierendes Stylesheet Regeln auch.

Zum Beispiel:

 .xleftcol { float: right; width: 35%; background:#608800; } .xmiddlecol { float: right; width: 35%; background:#eff3df; } 

2. Fügen Sie einen Verweis auf das Externe hinzu .css Datei direkt danach Tag in der Abschnitt von HTML-Blatt :

Vorteile von externem CSS:

• Unsere Dateien haben eine klarere Struktur und sind kleiner.
• Wir verwenden das Gleiche .css Datei für mehrere Webseiten in externem CSS.

Nachteile von externem CSS:

• Die Seiten können nicht korrekt ausgeliefert werden, bevor das externe CSS geladen ist.
• Bei externem CSS kann das Hochladen vieler CSS-Dateien die Downloadzeit einer Website verlängern.

3. Inline-CSS

Inline-CSS wird verwendet, um einen bestimmten Stil zu erstellen HTML Element. Füge hinzu ein Stil Attribut zu jedem HTML-Tag hinzufügen, ohne die Selektoren zu verwenden. Die Verwaltung einer Website kann schwierig sein, wenn wir sie nur verwenden Inline-CSS . Allerdings Inline CSS in HTML ist in manchen Situationen nützlich. Wir haben keinen Zugriff darauf CSS-Dateien oder um Stile auf Elemente anzuwenden.

Im folgenden Beispiel haben wir das Inline-CSS verwendet

Methodenteilzeichenfolge Java