Stylen mit Klassen
- Home
- Tutorials
- HTML/Web
- HTML & CSS Tutorial für Anfänger
- Stylen mit Klassen
Klassen kann man im Prinzip so verwenden wie IDs nur, dass sie nicht nur ein einziges Mal sondern beliebig oft auf einer Seite verwendet werden können. Wenn ihr also eine Regel für mehrere Paragraphen verwenden möchtet, jedoch nicht auf alle Paragraphen verwenden möchtet, dann macht das folgendermaßen:
<!doctype html>
<html>
<head>
<title>
Erste Seite
</title>
<style type="text/css">
p.beispielKlasse{background-color:red; color:green}
.beispielKlasse2()
</style>
</head>
<body>
<p class='beispielKlasse'>Text mit Klassenstyle</p>
<p> Einfacher Text</p>
<p class='beispielKlasse'>Mehr Text mit Klassenstyle</p>
</body>
</html>
Regeln für Klasse macht man also so:
Tag für den die Regel verwendet werden soll + Punkt + Name{Regelinhalt}
Wenn die Klasse jedoch nicht nur für einen Bestimmten Tag funktionieren soll, dann lässt man das weg:
<style type="text/css">
.beispielKlasse2{background-color:yellow; color:red}
</style>
Diese Klasse lässt sich nun für alle unsere Bekannten Tags verwenden, ist somit nicht nur auf Paragraphen beschränkt.
Vorherig
IDs und Span
Nächste
Div
Kostenlos
HTML & CSS Tutorial für Anfänger
-
Einführung in HTML
-
Lektion1.1
-
Lektion1.2
-
Lektion1.3
-
-
Verschiedene Tags
-
Lektion2.1
-
Lektion2.2
-
Lektion2.3
-
Lektion2.4
-
Lektion2.5
-
Lektion2.6
-
-
Einführung in CSS
-
Lektion3.1
-
Lektion3.2
-
Lektion3.3
-
Lektion3.4
-
Lektion3.5
-
Lektion3.6
-
-
Tags mit CSS stylen
-
Lektion4.1
-
Lektion4.2
-
Lektion4.3
-
Lektion4.4
-
Lektion4.5
-
-
Wichtige Einsteigertricks
-
Lektion5.1
-
Lektion5.2
-
Lektion5.3
-
Lektion5.4
-
Lektion5.5
-
Lektion5.6
-
Lektion5.7
-
-
CSS in der Praxis
-
Lektion6.1
-
Lektion6.2
-
Lektion6.3
-
Lektion6.4
-
Lektion6.5
-
-
Formulare und Dropdown-Listen
-
Lektion7.1
-
Lektion7.2
-
Lektion7.3
-
Lektion7.4
-
Lektion7.5
-
Beliebte Kurse
Spring Boot Webentwicklung - RESTful APIs entwickeln!
Lerne Spring Boot und erstelle RESTful APIs Das beliebteste Java...
29,99€
Die Java 11 Masterclass - Werde zum Profi-Entwickler!
Werde zum Entwickler mit der Java 11 Masterclass! Starte in...
29,99€
Spiele entwickeln mit Unity 3D – Erstelle eigene Games in C# - Starter
Willkommen zum kostenlosen Teil des Kurses: "Spiele entwickeln mit Unity...
Kostenlos