Heute werde ich mal ein kurzes Tutorial über das Styling von blockquotes erstellen.
Im großen und ganzen wird das Ergebniss letzendlich so aussehen:

Der erste Vorschlag für Cascading Style Sheets kam 1993 auf, mehrere weitere folgten bis 1995.

Das HTML hierfür sieht ganz einfach aus:

<blockquote>
  <em>Der erste Vorschlag für Cascading Style Sheets kam 1993 auf, mehrere weitere folgten bis 1995.</em>
</blockquote>

Gefolgt vom CSS:

blockquote {
	background: url(images/blockquote_left.gif) no-repeat top left;
	margin: 0 15px;
	padding: 0 0 0 40px;
	color: #999;
	font-size: 140%;
}
 
blockquote em {
	margin: 0;
	padding: 0 30px 0 0;
        background: url(images/blockquote_right.gif) no-repeat bottom right;
	display: block;	
}

Das “blockquote” Tag hat die linke Hintergrundgrafik, welche oben links ausgerichtet wird. Das “em” Tag die rechte. Dazu noch bischen padding damit der Text die Hintergrundgrafik nicht verdeckt.

P.S. Hab noch keine zeit gehabt es unter IE zu testen.