Bagaimana menambahkan Drop and Text Shadows di Dreamweaver - dummies

Anda dapat meningkatkan desain Anda di Dreamweaver dan memberikan halaman Anda lebih dalam dengan menambahkan bayangan drop ke gambar, tag, dan elemen lainnya. Menambahkan bayangan teks membuat kata-kata Anda lebih mudah dibaca, terutama jika desain Anda memiliki latar belakang yang rumit atau latar depan dan warna latar belakang kurang kontras.

Kredit: Foto oleh iStockphoto. com

Dreamweaver CC memberikan dukungan dan integrasi yang lebih baik dari bayangan drop CSS3 dan bayangan teks dari panel Designer CSS yang baru.

Anda dapat membuat gaya kelas atau ID dengan bayangan teks, dan Anda dapat menambahkan bayangan teks ke elemen HTML yang ada dengan menentukan gaya tag, seperti gaya judul 1 yang terlihat di sini. Kode CSS3 yang menciptakan bayangan teks itu adalah

h1 {text-shadow: 2px 2px 2px # 000;}

Angka pada kode menentukan bahwa bayangan teks harus meluas 2 piksel ke kanan dan 2 piksel di bawah teks dengan blur 2-pixel. Selain itu, bayangan dibuat dengan warna hitam, ditentukan dengan kode warna heksadesimal disingkat # 000.

Saat membuat aturan untuk bayangan teks Anda dapat menentukan hingga empat nilai:

• horizontal dan vertikal : Dua nilai angka pertama diperlukan dan tentukan horisontal dan offset vertikal - jarak drop shadow meluas di bawah teks (vertikal ) dan di sebelah kanan teks (horizontal).

• blur radius : Nilai ketiga menentukan jumlah kabur dalam bayangan. Jika tidak termasuk radius blur, defaultnya adalah 0, yang membuat bayangan tampil sebagai warna solid.

• warna : Nilai keempat menentukan warna bayangan dan dapat didefinisikan dengan menggunakan kode warna heksadesimal atau kode warna RGBa.

Memilih warna RGBa untuk opsi Warna memberi Anda kontrol lebih besar terhadap penampilan bayangan karena Anda dapat menambahkan transparansi.

Anda dapat menambahkan bayangan teks menggunakan panel Properties di bagian bawah panel Perancang CSS. Untuk melakukannya, ikuti langkah-langkah ini:

1. Gulir ke bawah ke bagian Text-Shadow pada panel Properties Perancang CSS.

2. Masukkan ukuran bayangan yang ingin Anda tampilkan menggunakan bidang H-shadow (horizontal) dan V-shadow (vertikal).

3. Tambahkan jumlah blur yang Anda inginkan untuk bayangan teks Anda dengan memasukkan ukuran di bidang Blur.

4. Klik warna dengan baik dan pilih warna yang ingin Anda gunakan dalam bayangan teks.