Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Cascading Style Sheets (CSS) zur Gestaltung von HTML-Dokumenten nutzen
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
<title>Codeschnipsel: Cascading Style Sheets-Demo - by 01-Scripts.de</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
<meta name="author" content="Michael Lorer - www.01-scripts.de" />
<meta name="description" content="Cascading Style Sheets (CSS) zur Gestaltung von HTML-Dokumenten nutzen" />
<!-- Lizenziert unter Creative Commons Namensnennung 3.0 Deutschland (CC BY 3.0)
http://creativecommons.org/licenses/by/3.0/de/ -->
<link rel="stylesheet" media="all" href="style.css" type="text/css" />
</head>
<body>
<h1>h1: Codeschnipsel: Cascading Style Sheets-Demo - by 01-Scripts.de</h1>
<p><a href="http://www.01-scripts.de">Lorem</a> ipsum dolor sit amet, consectetur adipiscing elit. Donec id quam in lacus congue convallis sed ac diam. In id ante purus, at commodo orci. Sed nisl massa, consequat sed dignissim quis, facilisis ut dui. Maecenas ac felis mauris. Donec elementum dui mattis dolor gravida id dapibus quam scelerisque. Morbi velit nisl, consectetur sit amet congue ut, eleifend vel magna. Phasellus non lectus non augue tincidunt euismod ut non elit. Nam id elit magna.</p>
<h2>h2: Codeschnipsel: Cascading Style Sheets-Demo - by 01-Scripts.de</h2>
<p>Ein <i class="klasse1">Text</i> mit <b class="klasse1">verschiedenen</b> <span class="klasse1">Auszeichnungselementen</span></p>
<p>Ein <i class="klasse2">Text</i> mit <b class="klasse2">verschiedenen</b> <span class="klasse2">Auszeichnungselementen</span></p>
<p style="margin-top: 100px;" class="small">Dieser Beitrag ist unter der <a href="http://creativecommons.org/licenses/by/3.0/de/">Creative Commons Namensnennung 3.0 Deutschland</a> lizensiert.<br />
Bearbeitung, Nutzung &amp; Verbreitung ist ausdr&uuml;cklich gestattet.</p>
</body>
</html>
/* Überschrfiten 1. Ordnung */
h1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 20px;
color:#FF0000
}
/* Überschrfiten 2. Ordnung */
h2 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 16px;
color:#00FF00
}
/* Links */
a:link {
color:#000099;
font-weight: bold;
text-decoration:underline;
}
/* bereits besuchte Links */
a:visited {
color:#0000FF;
font-weight: bold;
text-decoration:none;
}
/* Links beim darüberfahren mit der Maus */
a:hover {
color:#FF0000;
text-decoration:none;
}
/* aktive Links */
a:active {
color:#000000;
text-decoration:none;
}
/* Eigenschaften für eigene Klassen: */
.klasse1 {
text-decoration: underline;
}
/* Eigenschaften für einen bestimmtes Element einer Klassen: */
span.klasse2 {
text-decoration: overline;
}
@01-Scripts

This comment has been minimized.

Copy link
Owner Author

commented Jul 11, 2012

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.