webmaster webmastering webdesign

Jesteś tutaj: webmade.org >> porady >> xhtml + html + css

Wyróżniony tekst

autor: Patryk 'yarpo' Jar, ostatnia modyfikacja: 2007-02-21

szukaj: wyróżniony tekst wyróżniony tekst

Chciałbyś w szczególny sposób uwidocznić czyjś cytat na stronie? Nic prostszego - starczy CSS :-)

Będziemy potrzebować dwóch pojemników:

..
<html>
<head>
<title>Strona</title>
</head>
<body>
<div>
 <p>Być, albo nie być.<br /> Oto jest pytanie!</p>
</div>
</body>
</html>

No i póki co, to jeszcze niczego ciekawego nie ma. Dodajmy więc temu trochę stylów:

div {
 background: transparent url(cytat.gif) bottom left no-repeat;
 width: 30%;
}
div p {
 background: transparent url(cytat.gif) top right no-repeat;
 font: bold italic 2em Arial, sans-serif;
 padding: 0.5em 1em;
 line-height: 2.5em;
 text-align: center;
 width: 100%;
}

Teraz to zaczyna wyglądać naprawdę nie źle. Aby zobaczyć jak to wygląda, skopiuj powyższy kod, a także pobierz plik.

Patryk 'yarpo' Jar

Osoby czytające tę publikację przeglądały również:

Chcesz zaoszczędzić czas i pieniądze?
Strony www.
Skontaktuj się z nami!

 

valid XHTML
valid CSS
© 2004-2008 copyright by webmade.org