Pada tutorial kali ini akan membahas bagaimana cara mengatur teks pada CSS dengan menggunakan text shadow. Untuk mendapatkan efek teks shadow pada CSS dapat menggunakan properti text-shadow. Properti text-shadow pada CSS digunakan untuk menambahkan efek bayangan pada teks.
Penggunaaan properti text-shadow yang paling sederhana, adalah membuat efek teks shadow secara horizontal (2px) dan vertikal (2px):
Berikut ini contoh penggunaan properti text-shadow horisontal dan vertikal:
<!DOCTYPE html> <html> <head> <style> h1 { text-shadow: 2px 2px; } </style> </head> <body> <h1>Text-shadow effect!</h1> </body> </html>
Coba tambahkan efek warna merah (red) pada properti text-shadow:
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
text-shadow: 2px 2px red;
}
</style>
</head>
<body>
<h1>Text-shadow effect!</h1>
</body>
</html>
Coba tambahkan efek blur (5x) pada properti text-shadow:
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
text-shadow: 2px 2px 5px red ;
}
</style>
</head>
<body>
<h1>Text-shadow effect!</h1>
</body>
</html>
Sekian bahasan dan cara menggunakan tentang text shadow pada CSS untuk memperkaya halaman html anda, semoga bermanfaat.
