Bir html elemanına nasıl parlama efekti verilir?
Yayınlanma Tarihi : 26 Temmuz 2020Bunun için text-shadow ve box-shadow özellikleri kullanılabilir. text-shadow özelliği metinlere, box-shadow ise div, table ve img gibi html elemanlarına uygulanır. Aşağıda bu iki özelliğin kullanıldığı örneği inceleyebilirsiniz.
/* h1 elemanına uygulanan text-shadow (metin-gölgelendirme) özelliği. */
/* text-shadow özelliğinin ilk parametresi gölgelendirmenin html elemanının ne kadar sağına, ikinci parametre de ne kadar aşağısına kayacağını belirtir. Üçüncü parametre verilecek gölgenin ne kadar yayılacağını (genişliğini), dördüncü parametre ise verilecek gölgenin rengini belirtir. */
/* 5px genişliğinde altın (gold) renkli, elementin tam ortasına (kaydırılmadan) uygulanmış gölgelendirme (parlama) efekti. */
h1 {
text-shadow: 0px 0px 5px gold;
}
/* "resim" id'li img elemanına uygulanan box-shadow (kutu-gölgelendirme) özelliği. */
/* 5px sağa, 10px aşağı kaydırılmış, 10px genişliğinde fıstık yeşili renkli gölgelendirme (parlama) efekti. */
img#resim {
box-shadow: 5px 10px 10px yellowgreen;
}