Forum PHP.pl > [CSS] fajny efekt tekstu

Pomoc - Szukaj - Użytkownicy - Kalendarz

Taifun

25.04.2009, 18:13:37

Witam,
http://ugotuj.eu/film/59/salatka-ziemniaczana/
po prawej jest Wyszukiwarka przepisów i ta czcionka jest świetna. Jak taki efekt zrobić?
Co to jest w ogóle? cień?

v1t4n

25.04.2009, 18:23:10

2x zapisany text w html:

[HTML] pobierz, plaintext 
<div class="box-header">Wyszukiwarka przepisów<span>Wyszukiwarka przepisów</span></div>
[HTML] pobierz, plaintext

A w CSS:

Kod

.box-header { background:#edc088 url(/img/box-header.gif) no-repeat 0 0; width:280px; height:34px; padding:0 10px; line-height:34px; font-size:15px; font-weight:bold; color:#fff; clear:both; overflow:hidden; position:relative; z-index:0; }
.box-header span { position:absolute; padding:0 10px; left:1px; top:1px; z-index:-1; color:#cba26e; }

Krotko mowiac podlozony pod spod i przesuniety po 1px w dol i w prawo.

Kildyt

25.04.2009, 20:16:15

Całe szczęście, że w CSS v3 będzie to skrócone do jednego polecenia.

PS Opera już wspiera cienie. Trzeba niestety poczekać na inne przeglądarki.

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.