Logo Logo
InfoHome Themen Projekte Links Software
Themen
JavaHamster
BlueJ
Java
HTML
XHTML
CSS
Stile definieren
Stile einbinden
Klassen definieren
Unterklassen
Pseudo-Formate
Eigenschaften
Einheiten
Aufgaben
XML
Datenbanken
MySQL
Theoretische Informatik
PHP
Kara
Lego-Roboter
Algorithmen

Stile einbinden

CSS-Stile können mit drei verschiedenen Methoden in HTML eingebunden werden:

Lokal: Direkt in einem HTML-Tag im Body der Webseite. Der Stil gilt dann nur für dieses Tag.

<p style="font-size:14pt;">

Intern: Im Head-Bereich einer Seite.

<html>
<head>
<title>CSS</title>
<style type="text/css">
<!--
p {font-size:12pt;}
h1 {font-size:12pt;}
-->
</style>
</head>

Die Stile gelten für die ganze Seite.

Extern: Die Stile werden in einer externen Datei mit der Endung .css gespeichert. Diese CSS-Datei wird in einer oder mehreren HTML-Seiten im Head-Bereich eingebunden.

Head-Bereich der HTML-Seite:


<html>
<head>
<title>CSS</title>
<link rel="stylesheet" type="text/css" href="stile.css">
</head>

Inhalt der Datei stile.css:

p {font-size:12pt;}
h1 {font-size:12pt;}

Die Stile gelten für alle Webseiten, in denen die CSS-Datei eingebunden wird. Die externe Methode eignet sich hervorragend, um einer kompletten Webseite ein einheitliches Erscheinungsbild zu geben.

Die Methoden lassen sich auch kombinieren. Lokale Stile überschreiben dabei interne Stile und die internen Stile überschreiben Stilregeln, die in einer externen Datei definiert wurden. Diese Verhaltensweise hat den Cascading Style Sheets ihren Namen gegeben.

» drucken: pdf | html

© 2004-2023 M. Blanke · Ursulaschule · Kleine Domsfreiheit 11-18 · 49074 Osnabrück