CSS Kurs – Überschriften und Absätze

CSS Kurs – Überschriften und Absätze
5 Sterne
1 Bewertungen

Dieser Beitrag ist Teil des CSS Kurses.
Überschriften und Absätze helfen bei der Orientierung. In diesem Beitrag lernen Sie den Text Ihrer Webseite zu strukturieren.
HTML kennt sechs verschiedene Gliederungsebenen für Überschriften, von h1 bis h6.
Wir fügen nun im Kopfbereich eine Überschrift ein. Kümmern Sie sich zunächst nicht um das Aussehen, dieses gestalten wir später mit CSS. Unter der Hauptunterschrift fügen wir einen Slogan hinzu. Dazu verwenden wir das HTML Element p für Absatz (engl. paragraph). Innerhalb des Absatzes wollen wir später einen Satz besonders hervorheben. Daher wird dieser mit span umspannt. Dieser Satz bekommt also ein eigenes Kästchen innerhalb des Absatz-Kästchens.


<div id="kopfbereich">
<h1>CSS Kurs</h1>
<p>CSS ist einfach. <span>Das Wesentliche auf den Punkt gebracht</span>.</p>
</div> <!-- kopfbereich -->

Das Ergebnis sieht wie folgt aus.
Eine Überschrift und ein Absatz
Probieren Sie es selbst aus!

Quellen und weiterführende Literatur:
Peter Müller (2013): Flexible Boxes

Falls Ihnen dieser Beitrag weitergeholfen hat, wäre es eine sehr nette Anerkennung meiner Arbeit wenn Sie z.B. Ihre Bücher über Amazon bestellen würden. Wenn Sie ein Produkt kaufen, erhalte ich dafür eine Provision. Für Sie ändert sich am Preis des Produktes gar nichts. Ich möchte mich an dieser Stelle jetzt schon für Ihre Unterstützung bedanken.

Denis Reis ist Business Intelligence Consultant und gibt als Buchautor sein Wissen rund um den SAP Projektalltag weiter. Wenn Sie tatkräftige Unterstützung bei Ihren SAP BI Projekten benötigen, können Sie ihn über Xing, LinkedIn oder Facebook kontaktieren.
Des Weiteren unterrichtet er Projektmanagement und Controlling an der Wiesbaden Business School. Der aus Düsseldorf stammende Familienmensch zählt zu denjenigen, die auf komplizierte Darstellungen verzichten und das Ganze auf den Punkt bringen.

0 Kommentare

Dein Kommentar

Want to join the discussion?
Feel free to contribute!

Kommentar verfassen