Final
Image:
Metode
outline tex-shadow memiliki banyak ragam elemen sintaks. Diantaranya adalah: text-outline: X Y
blur Color. Pada kenyataannya,
elemen ini tidak didukung oleh hampir semua browser yang ada. Selain itu, ada
pula yang menggunakan Webkit: -webkit-text-stroke: 2px black. Memang kelihatannya
bagus tapi akan hilang browser yang lain. Tapi dengan trik tertentu, efek ini
akan muncul.
Daripada
bingung mencari caranya, ada solusi untuk membuat efek outline/stroke seperti
diatas. Cara mengakalinya adalah dengan menggunakan text-shadow. Memang CSS
yang akan dibuat terlalu panjang, tapi hasilnya cukup memuaskan pada browser
seperti Firefox atau Opera dan IE 10. Catatan: pilih font yang sesuai hingga
tampilan outlinenya baik.
Kenapa?
Saya sudah mencoba beberapa font dan hasilnya tidak terlalu memuaskan. Gambar
diatas outlinenya memang kurang menutupi, sedikit bumpy. But it looks good to
me. Ini adalah kode CSSnya:
Untuk
membuat banyak outline pada fontnya, buat kode CSS yang baru dan letakkan
dibawahnya.
Untuk
menjadikannya lebih keren, bisa ditambahkan drop shadow, blur, back light atau
apapun yang bagus menurut anda. Ini salah satu yang sudah dibuat.
No comments:
Post a Comment