Anda Sedang Iqro

Membuat Text Efek Letterpress dengan CSS


Text Letterpress adalah effect text seperti hasil cetakan, untuk lebih jelasnya silakan lihat pada Handicraftkoe atau Djepara Tempoe Doeloe. langsung saja cara membuatnya :
Untuk menciptakan efek cetak atau Letterpress, kita perlu menambahkan bayangan yang lebih terang daripada warna teks, caranya cukup mudah yaitu cukup dengan menambahkan kode text-shadow: pada css lalu isikan X-Offset, Y-Offset, Blur dan Color, sebagai contoh yang saya pakai pada Djepara Tempoe Doeloe
text-shadow: 1px 0px 2px #363636;
Untuk penjelasan silakan lihat gambar (image from line25.com)

X-Offset adalah pergeseran bayangan kekanan atau kekiri, jika ingin melakukan pergeseran ke kiri tambahkan "-" (negatif) semisal -2px.
Y-Offset adalah pergeseran bayangan ke atas atau kebawah, jika ingin melakukan pergeseran ke atas, tambahkan juga "-" (negatif)  semisal -2 px
Blur adalah besaran efek bayangan kabur
Color adalah warna yang digunakan sebagai bayangan

Selain Letterpress, dengan text-shadow anda juga bisa membuat text effet lainnya seperti glow, timbul, dll. Silakan berskperiment sendiri dengan text-shadow
catatan cuss

Comments for this entry

Leave your comment

 

Copyright 2010. All rights reserved.

RSS Feed. This blog is proudly powered by Blogger and uses Modern Clix, a theme by Rodrigo Galindez. Modern Clix blogger template by Introblogger.