Cara Membuat Efek TEXT SHADOW Hardshadow

Diberi nama Hard Text Shadow karena shadow/bayangan yang ada dibelakang teks utama merupakan hasil duplikat tegas seperti teks diatasnya.

Elemen sintaks yang normalnya digunakan untuk membuat efek ini terdiri atas beberapa variabel. Misalkan sintaks CSSnya dibuat seperti ini:

 text-shadow: 3px 6px #000000;

Dua yang pertama (3px dan 6px) adalah nilai yang menentukan jauhnya posisi bayangan akan jatuh. 3px adalah horizontal-offset-nya (teks didorong sebanyak 3px ke kanan) sedangkan 6px adalah vertical-offset-nya (teks didorong sebanyak 6px ke bawah) sedangakan #FF0000 warna dari hard-shadownya. Untuk mengambil contoh warnanya, kunjungi colorpicker atau color info. Hasilnya akan seperti berikut:

Agar bayangan bayangannya berada ditempat yang berbeda, maka masukkan salah satu nilai horizontal dan vertikal menjadi negatif atau perpaduan dari keduanya. Misalkan duplikat teks hendak diletakkan di kanan atas, maka kodenya CSSnya menjadi seperti ini:

Text-shadow: 3px 6px #000000;

Di kiri atas kodenya menjadi: text-shadow: -3px -6px  #000000;

Atau, di kiri bawah: text-shadow: -3px 6px #000000;

Atau, teks tersebut dapat dibuat memiliki banyak Hard Shadow. Ini merupakan hal yang ada diluar kebiasaan para ahli web design. Tapi apa salahnya jika dibuat. Misalkan, saya akan membuat setiap warna hard shadow dengan warna yang berbeda. Ini untuk membedakan setiap hard shadow yang tampil nanti. Kode yang akan dibuat seperti ini:

text-shadow: 3px 6px #FF0000,

text-shadow: 3px -6px #00FFFF,

text-shadow: -3px -6px #FF00FF,

text-shadow: -3px 6px #0000FF;

selanjutnya, bagaimana jika bayangan tersebut dapat dibuat satu arah dengan dengan warna yang berbeda juga. Maka kode CSSnya harus dibuat seperti ini:

text-shadow: 3px -6px #FF0000,

text-shadow: 6px -9px #00FFFF,

text-shadow: 9px -12px #FF00FF,

text-shadow: 12px -15px #0000FF;

Terakhir, lebih tidak biasa lagi. Yang terpenting adalah memahami tentang nilai horisontal (X) dan vertikal (Y) offset.