Dreamweaver CS6: Menambah Strayang Teks dengan CSS3 - dummies

Sebahagian daripada Dreamweaver CS6 Untuk Menipu Cheat Sheet

Dalam Dreamweaver CS6, anda boleh meningkatkan reka bentuk anda dan memberikan kedalaman anda dengan lebih mendalam dengan menambah bayang-bayang teks dengan peraturan CSS3, terkini dalam teknologi web. Menambah bayang-bayang teks menjadikan kata-kata anda lebih mudah dibaca, terutamanya jika reka bentuk anda mempunyai latar belakang yang kompleks atau jika latar belakang dan warna teks anda kurang jelas.

kredit: Paul Gual, istockphoto. com

Dreamweaver CS6 termasuk sokongan untuk bayang-bayang teks CSS3 apabila anda menggunakan panel Properties dalam panel CSS Styles. 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 digunakan dalam imej.

Kod CSS3 yang mencipta bayangan teks ialah

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

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

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

• Mendatar dan menegak: Dua nilai nombor pertama diperlukan dan menentukan offset melintang dan menegak - jarak bayang drop jatuh di bawah teks (mendatar) dan di sebelah kanan teks (menegak).

• Rim Blur: Nilai ketiga menentukan jumlah kabur dalam bayang-bayang. 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.

Anda boleh menambah bayangan teks menggunakan anak tetingkap Harta di bahagian bawah panel CSS Styles, seperti yang ditunjukkan dalam imej. Untuk berbuat demikian, ikuti langkah berikut:

1. Klik pautan Add Property di sebelah kiri CSS Styles Property pane.

2. Masukkan nama peraturan gaya CSS3, bayangan teks, atau pilih aturan gaya dari senarai juntai bawah.

   Selepas nama muncul di sebelah kiri, anak panah kecil muncul di sebelah kanan.

3. Klik untuk memilih anak panah di sebelah kanan bayang-bayang teks.

   Kotak muncul.

4. Masukkan X dan Y offset, jejari blur, dan warna.