Press "Enter" to skip to content

Kode Praktis CSS3: Membuat Bayangan pada Objek atau Teks dengan Efek Blur

Kode Praktis berikut ini bisa kita gunakan untuk membuat objek atau teks memiliki bayangan dengan efek blur. Maksud dari blur tersebut adalah samar-samar šŸ˜€ tapiĀ bukan remang-remang ya šŸ˜‰

Efek bayangan pada halaman HTMLĀ dibentukĀ dengan bantuanĀ CSS versi 3. Efek bayangan ini ada 2 macam, yaitu text-shadow dan box-shadow.

text-shadow

Langsung saja, kode praktisnya sebagai berikut untuk text-shadow:

h1 {
   color: #FFFFFF;
   text-shadow: 2px 2px 4px #000000;
}

Gambaran hasilnya kira-kira seperti ini:

Bayangan dengan Efek Blur pada Teks

box-shadow

Oke, berikutnya untuk box-shadow:

div {
   color: #FF5555;
   padding: 30px;
   margin: 20px;
   box-shadow: 0px 0px 10px #000000;
}

Hasilnya seperti gambar ini.

Bayangan dengan Efek Blur pada Objek

Demikian kode praktis bayangan dengan efek blur,Ā tunggu kode praktis lainnya šŸ˜€

One Comment

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *