<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=ISO-8859-1">
<title>CSS-Klassen</title>
.rotbrklein { color: maroon; font-size: 9px; font-family: Arial, Helvetica, Geneva, Swiss, SunSans-Regular }
.blau14 { color: blue; font-size: 14px; text-align: left; margin-bottom: 20px }
.gruen12 { color: green; font-style: normal; font-size: 12px; text-decoration: none; text-align: center }
.caps { font-weight: 600; font-family: "Times New Roman", Georgia, Times; text-transform: uppercase }
.underline { font-style: normal; font-variant: small-caps; font-weight: normal; font-family: Monaco, "Courier New", Courier; text-decoration: underline }
.grau { color: #666; font-variant: small-caps; font-weight: 900; font-family: "Courier New", Courier; text-decoration: underline }
.spacing { background-color: #9cffff; text-indent: 10px; word-spacing: 3px; letter-spacing: 2px; margin: 20px; padding: 10px; border: double 2px blue }
.lila { color: purple; font-size: 10px; font-family: Arial, Helvetica, Geneva, Swiss, SunSans-Regular }
--></style>
</head>
<body bgcolor="#ffffff">
<div align="right">
<p><a href="text_ohne_css.html"><span class="rotbrklein">a) Beispiel ohne CSS</span></a> | b) Beispiel mit CSS-Formatierung</p>
</div>
<div align="center">
<h4></h4>
<h4><span class="blau14">Beispiel zur CSS-Klassenformatierung</span></h4>
</div>
<p>Diesen Text werden wir in einem Fall mit <span class="lila"><b>normalen html-Tags</b></span>
in anderem Fall mit <b><span class="lila">CSS-Klassen</span> </b>formatieren.</p>
<p class="spacing">Wie Sie sehen, gibt es mit<b> <span class="blau14">CSS-Klassen</span></b> sehr <i><span class="grau">weitgehende Differenzierungsmöglichkeiten</span></i> von Textformatierung.</p>
<p class="spacing"><i><span class="underline">Empfehlung</span></i>: Sie sollten aber <b><span class="blau14">entweder</span></b> CSS-Element-Selektoren <b><span class="blau14">oder</span></b> CSS-Klassen zur CSS-Textformatierung verwenden und nicht beides gleichzeitig. CSS kann da <span class="lila">"<i>Zuständigkeitsschwierigkeiten"</i> </span>bekommen.</p>
<h4><span class="gruen12">Was halten Sie von CSS?</span></h4>
<ul>
<li><span class="caps">brauch ich nicht</span></li>
<li><span class="caps">gut, aber kompliziert</span></li>
<li><span class="caps">Pipifax, ich brauch eh kein Layout</span></li>
<li><span class="caps">Hervorragend, die Möglichkeiten der Zukunft im Web</span></li>
</ul>
<p><span class="spacing">Also das war's dann.....</span></p>
</body>
</html>