Dahulu saat kita ingin membuat text shadow mungkin harus memasukan melalui gambar yang kita buat sebelumnya, tapi pada CSS3 kita bisa langsung membuat text shadow.
Nah, tanpa harus panjang lebar, yukk kita buat text shadow di CSS
1. Misalnya saya mempunyai kode html sebagai berikut
<!DOCTYPE html>2. Lalu, anda masukan kode CSS sebelum penutup tag head, bisa juga melalui linked css. Pada tutorial ini saya ingin merubah tag H1 dengan text shadow.
<html>
<head>
<meta charset="utf-8" />
<title>Contoh Membuat Text Shadow di CSS</title>
</head>
<body>
<h1>Ini adalah text Shadow</h1>
</body>
</html>
<style>3. Penjelasan skrip nya adalah : 2px yang pertama adalah untuk mengatur ketebalan shadow pada sumbu x dan 2px yang kedua adalah untuk mengatur ketebalan pada sumbu y sedangkan #ff0000 adalah kode hexa untuk menentukan warna text shadownya, bisa juga dengan nama misalnya Red.
h1 {
text-shadow: 2px 2px #ff0000; }
</style>
Kode lengkapnya adalah sebagai berikut :
<!DOCTYPE html>4. Lalu silahkan anda lihat hasilnya di browser kesayangan anda :-). Apabila anda ingin mencobanya secara online silahkan langsung klik disini
<html>
<head>
<meta charset="utf-8" />
<title>Contoh Membuat Text Shadow di CSS</title>
<style>
h1 {
text-shadow: 2px 2px #ff0000;
}
</style>
</head>
<body>
<h1>Ini adalah text Shadow</h1>
</body>
</html>
Hasil Text Shadow dengan CSS3 |
Anda butuh Jasa Pembuatan Website untuk Perusahaan atau Toko Online anda? Segera hubungi kami sekarang juga dan dapatkan diskon akhir tahun.
Bintaro Web Design
Tlp : 02171370813
HP : 085710190845
PIN BBM : 7DC8D13D
Email : info@bintaroweb.com