CSS
Links
Zielsetzung
Cascading Style Sheets (CSS) ist eine Sprache, mit der HTML-Inhalte mit Formateigenschaften ausgestattet werden. Das dient der Trennung von Inhalt (HTML) und Form (CSS).
Schnellkurs
- Datei anlegen: index.html
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="tutorial.css">
</head>
<body>
<h1>Try it!</h1>
<div class="region1">
This is a paragraph.
</div>
<div class="region2">
<div class="error">Error found</div>
<div class="warning">Warning: it is dangerous</div>
</div>
<div class="region1">
This is a paragraph too.
</div>
</body>
</html>
- Datei anlegen: tutorial.css
body {
background-color: lightgrey;
}
.region1 {
background-color: lightgreen;
margin: 1em 33%;
}
.region2 {
background-color: white;
margin: 2em 3em 2em 1em;
}
.error {
color: red;
padding: 1em;
}
.warning {
color: blue;
padding 2em;
}
- Datei index.php im Browser öffnen.