HTML - Element: <style>

Der <style>-Tag fügt CSS-Anweisungen in ein Dokument ein. Dabei gibt es vier Möglichkeiten um CSS-Anweisungen im Dokument einzubinden:

  1. Zwischen den <head>-Tags für interne Anweisungen (Beispiel siehe unten).
  2. Zwischen den <head>-Tags als externe Datei.
  3. Im HTML-Element mit dem Attribut style="", class="" oder id="" (Beispiel siehe unten).
  4. Zwischen den <body>-Tags.
<!DOCTYPE html>
<html>
<head>
 <title>Das P-Element mit einer CSS-Anweisung formatieren</title>

 <style>
 p {
  color: Red;
  background-color: Yellow;
 }
 </style>

</head>
<body>

<h1>Das P-Element mit einer CSS-Anweisung formatieren</h1>

<p>Weit hinten, hinter den Wortbergen, fern der Länder Vokalien und Konsonantien 
leben die Blindtexte.</p>

</body>
</html>

Beispiel anzeigen

Mit dem Universal-Attribut style="", lassen sich im Dokument beliebige HTML-Elemente formatieren.

<p style="color: Blue; background-color: Green;">
Weit hinten, hinter den Wortbergen, fern der Länder Vokalien und Konsonantien 
leben die Blindtexte.
</p>

Bausteine  Alle Anzeigen

Eine zufällige Auswahl von Codeschnipseln aus den Bereichen HTML, CSS, PHP, JavaScript und MySQL.

<colgroup> Tabellenspalten vordefinieren

CSS - Animationen mit Keyframes

PHP - Datum und Uhrzeit formatiert ausgeben

JavaScript - Zahlenwerte überprüfen und korrigieren

MySQL - Suchen und Ersetzen in einer Tabellenspalte

Grafiken mit Größenangabe
Um lange Wartezeiten beim Aufbau einer HTML-Seite zu vermeiden muss man die Größe einer vorhandenen Grafik mitangeben. Durch diese Angabe kann der Browser für die Grafik den Platz reservieren und kann den Rest der Seite laden, ohne auf das Downloaden der kompletten Grafik zu warten.
<img src="bild.gif" height="Höhe des Bildes in Pixeln" width="Breite des Bildes">
Verwenden Sie niemals die Attribute WIDTH und HEIGHT, um die Größe einer Grafik in HTML zu ändern. Wenn andere Größen benötigt werden, dann erstellen Sie dafür eine kleinere beziehungsweise größere Version der Grafik.