CSS: 3D efekt na besedilu

CSS efekti so zabavna stvar. Z malo domišljije in igranja lahko dosežemo veliko različnih efektov, eden izmed takih je tudi 3D efekt, ki je zelo podoben efektom ki smo jih včasih srečevali v knjigah za katere smo rabili papirnata 3D očala.

CSS 3D efekt na besedilu se pripravi izredno preprosto. Glavna sestavina je značka “text-shadow” s katero določimo senco, v našem primeru dvojno senco, vsako v svoji barvi. Na :hover pa to značko popravimo tako, da eno barvo/senco zamaknemo v levo, drugo pa v desno stran. Če k temu za boljši prehod dodamo še značko “transition” je zadeva popolna.

Primer:

See the Pen
CSS: 3D efekt na besedilu
by Ziga (@pomagalnik)
on CodePen.

Komentiraj


*