Cara Tambah Drop and Text Shadows di Dreamweaver - dummies

Anda boleh meningkatkan reka bentuk anda dalam Dreamweaver dan memberikan kedalaman anda lebih besar dengan menambah bayangan drop kepada imej, tag, dan elemen lain. Menambah bayang-bayang teks menjadikan kata-kata anda lebih mudah dibaca, terutamanya jika reka bentuk anda mempunyai latar belakang yang kompleks atau warna latar depan dan latar belakang kurang kontras.

Kredit: Foto oleh iStockphoto. com

Dreamweaver CC menyediakan sokongan yang lebih baik dan integrasi bayang-bayang drop CSS3 dan bayang-bayang teks dari panel Designer CSS baru.

Anda boleh membuat gaya kelas atau ID dengan bayang-bayang teks, dan anda boleh menambah bayang teks kepada elemen HTML sedia ada dengan mendefinisikan gaya tag, seperti gaya tajuk 1 yang dilihat di sini. Kod CSS3 yang mencipta bayangan teks adalah

h1 {teks-bayangan: 2px 2px 2px # 000;}

Nombor dalam kod tersebut menyatakan bahawa bayang teks perlu melanjutkan 2 piksel ke kanan dan 2 piksel di bawah teks dengan blur 2-piksel. Di samping itu, bayangan dibuat dengan warna hitam, ditentukan oleh kod warna heksadesimal yang disingkat # 000.

Apabila membuat peraturan untuk bayang-bayang teks, anda boleh menentukan sehingga empat nilai:

• mendatar dan menegak : Dua nilai nombor pertama diperlukan dan menyatakan mendatar dan offset menegak - jarak bayangan drop melintang di bawah teks (menegak ) dan di sebelah kanan teks (mendatar).

• radius kabur : Nilai ketiga menentukan jumlah kabur dalam bayangan. Jika anda tidak menyertakan radius kabur, lalai adalah 0, yang menjadikan bayangan muncul sebagai warna pepejal.

• warna : Nilai keempat menentukan warna bayangan dan boleh ditakrifkan menggunakan kod warna heksadesimal atau kod warna RGBa.

Memilih warna RGBa untuk pilihan Warna memberikan anda kawalan yang lebih besar ke atas penampilan bayangan kerana anda boleh menambah ketelusan.

Anda boleh menambah bayangan teks menggunakan panel Properties di bahagian bawah panel Designer CSS. Untuk melakukannya, ikuti langkah berikut:

1. Tatal ke bawah ke bahagian Teks-Bayangan dalam panel Properties CSS Designer.

2. Masukkan saiz bayang yang anda mahu paparkan menggunakan medan H-bayang (mendatar) dan V-bayang (menegak).

3. Menambah jumlah kabur yang anda inginkan untuk bayangan teks anda dengan memasukkan saiz dalam medan Blur.

4. Klik warna dengan baik dan pilih warna yang hendak digunakan dalam bayangan teks.