Inhaltsverzeichnis

Clara mit CSS

Screenshot

Das Bild von Clara gibt es hier.

Der HTML-Quelltext

<html>
<head>
<title>Claras Seite</title>
<link rel="stylesheet" type="text/css" href="default.css">
</head>
<body>
<div class="content">
<h1>Clara, das Rhinozeros</h1>
<p>
<a href="http://www.cognitiones.de/doku.php/clara_das_rhinozeros"><b>Clara</b></a> (1738 - 1758) war ein weibliches indisches Nashorn, das Mitte des 18. Jahrhunderts durch eine siebzehnj&auml;hrige Ausstellungstour durch Europa ber&uuml;hmt wurde.</p>
<p>
<img src="2lykdre.jpeg" width="450" height="303" border="0" alt="Clara, das Rhinozeros" /></p>
<p class="capture">
Ein Porträt Claras nach der Natur von Jean-Baptiste Oudry (1686–1756).</p>
</div>
<div class="rechts">
<h2>Links</h2>
<ul>
<li>Cognitiones: <a href="http://www.cognitiones.de/doku.php/clara_das_rhinozeros">Clara</a></li>
<li>Baeck: <a href="http://de.wikisource.org/wiki/Eigentliche_und_accurate_Vorstellung_Des_neu_angekommenen_Asiatischen_Wunder-Thiers_Rhinoceros">Rhinoceros</a></li>
</ul>
</body>
</html>

Die Datei »default.css«

body {
	margin: 5;
	padding: 0;
	font-family: Palatino, "Palatino Linotype", serif;
	color: black;
	}
 
h1 {
	font: bold italic 2em "Trebuchet MS", Verdana, sans-serif;
	margin: 0;
	margin-bottom: 1.2em;
	padding: 0;
	background: #999;
	}
 
h2 {
	font: bold italic 1.5em "Trebuchet MS", Verdana, sans-serif;
	margin: 0;
	margin-left: 1em;
	padding: 0;
	}
 
 
p {
	margin: 5;
	padding: 0;
	}
li {
	font-style: italic;
	}
 
.capture {
	font-style: italic;
	}
 
.content {
	padding-top: 1em;
	float:left;
	width: 500 px;
	border-right: 1px solid black;
	}
 
 
.rechts {
	padding-top: 1em;
	margin: 0 2em 0 500px;
	}



Zurück zum Mitmachweb-Buch.


Eigene Werkzeuge
Werbung