Attribute in HTML-Tags

Ein HTML-Element kann durch zusätzliche Attribute ergänzt werden. Manche HTML-Elemente machen ohne zusätzliche Attribute keinen Sinn. Beispielsweise mach ein <a> Element ohne href Attribut keinen Sinn. Die Funktionalität des Attributs ergibt sich meistens direkt aus dem Attribut-Bezeichner.

Attribute werden innerhalb eines HTML-Elements definiert. Die Zuordnung zwischen Attribut-Bezeichner und Attribut-Wert erfolgt über das = Zeichen. Der Attribut-Wert muss in doppelte Anführungszeichen " gesetzt werden.

<HTML-Element Attribut-Bezeichner="Attribut-Wert">

Mehrere Attribute werden durch Leerzeichen getrennt.

<HTML-Element Attribut-Bezeichner1="Attribut-Wert1" Attribut-Bezeichner2="Attribut-Wert2" >

HTML-Universalattribute

Einige HTML-Attribute haben in allen Elementen (in denen sie auch vorkommen dürfen) eine global einheitliche Bedeutung. Diese Attribute werden als Universalattribute (global Attributes) bezeichnet.

In welchen Elementen welche Attribute erlaubt sind, sollte im Zweifelsfall in einer HTML-Referenz (z.B. w3c HTML-Referenz) überprüft werden

Einige Universalattribute sind in Zusammenhang mit CSS oder Javascript besonders wichtig.

Das class Attribut

Das class Attribut wird in HTML üblicherweise in Zusammenhang mit CSS verwendet. Damit lassen sich HTML-Elementen Klassen zuweisen, die dann mit CSS individuell formatiert werden können. So kann man für ein und das selbe HTML-Element durch die Zuweisung von Klassen mehrere unterschiedliche Formatierungen definieren.
Jede Klasse wird durch den Klassen-Bezeichner "benannt". Es ist sinnvoll, wenn aus dem Bezeichner der Klasse hervorgeht, was die Formatdefinition tut.

<p class="Syntax">
<em class="Befehl">&lt;HTML-Element</em> 
<em class="Befehl_Attribut">Attribut-Bezeichner</em>
="<em class="Befehl_Variable">Attribut-Wert</em>"
<em class="Befehl">&gt;</em>
</p>

em.Befehl {
font-style: italic;
font-weight: bold;
color: darkblue;
}

em.Befehl_Attribut {
font-style: normal;
font-weight: bold;
color: darkgreen;
}

em.Befehl_Variable {
font-style: italic;
font-weight: bold;
color: maroon;
}

Ein Selektor auf eine Klasse wird in CSS mit einem Punkt vor dem Klassen-Namen gebildet.

Das id Attribut

Mit dem id Attribut wird ein HTML-Element eindeutig gekennzeichnet. Eindeutig heißt, dass ein id Attribut mit einem bestimmten Inhalt nur ein einziges Mal in einem HTML-Dokument vorkommen darf.

Das id Attribut wird oft verwendet, um eindeutige Sprungmarken innerhalb eines Dokuments anzulegen, auf die dann verlinkt werden kann.

In CSS und JavaScript kann ein mit einer id gekennzeichnetes Element eindeutig identifiziert werden, um es bearbeiten zu können.

<h2 id="Kommentare">Kommentare in HTML-Dokumenten</h2>

<a href="#Kommentare">Link auf Kommentare</a>

Die id wird durch das Voranstellen eines # Zeichens angesprochen, auch in JavaScript und CSS.

Das style Attribut

Das style Attribut wird verwendet, um eine CSS-Formatanweisung innerhalb eines Elements im HTML-Quelltext zu definieren. Diese Art von Formatanweisung wird als Inline-Formatanweisung oder Inline-CSS bezeichnet.

Eine Inline-Anweisung überschreibt alle zentral vorgenommenen Formatanweisungen. Man kann so ein spezielles Element individuell mit CSS formatieren. Genau dafür ist eine Inline-Anweisung auch gedacht.
Prinzipiell sollte man CSS-Formatanweisungen möglichst als externe stylesheet-Datei auslagern. Unterschiedliche Formate für ein HTML-Element kann man mit Hilfe von Klassen definieren und diese Definitionen ebenfalls in der externen stylesheet-Datei unterbringen.