Bagaimana Menggunakan Panel Teks dalam Panel Hartanah CSS Dreamweaver - dummies

Panel Teks Dreamweaver mempunyai koleksi pilihan yang mengawal paparan teks dalam halaman anda. Anda boleh mengakses pilihan Panel Teks dengan menatal panel Properti sehingga anda mendapat di bawah pilihan Layout, atau dengan mengklik ikon T di bahagian atas panel.

Panel Teks termasuk pilihan pemformatan berikut:

• Warna: Tetapkan warna teks. Anda boleh mengklik warna dengan baik dan memilih warna, gunakan eyedropper untuk mencuba apa-apa warna pada skrin, atau masukkan kod warna heksadesimal dalam medan warna. Jika anda memasukkan kod warna heksadesimal, masukkan tanda pon awal (#).

• Font-Family: Tetapkan keluarga font atau satu siri keluarga. Anda boleh menambah fon dari pemacu keras tempatan anda atau dari Adobe TypeKit dengan memilih Manage Fonts di bahagian bawah senarai juntai bawah dan melancarkan kotak dialog Manage Fonts.

  

• Gaya Fon: Masukkan Normal, Italic, atau Oblique. Walau bagaimanapun, italik dan serong jarang berbeza dalam pelayar web, jadi tetap dengan italik kecuali anda mempunyai sebab tertentu tidak.

• Font-Variant: Tukar teks ke topi kecil. Uji reka bentuk anda dengan berhati-hati kerana atribut ini tidak disokong oleh semua penyemak imbas.

• Font-Weight: Buat teks muncul dengan huruf tebal dengan memilih Bold atau Bolder dari senarai juntai bawah. Anda juga boleh memasukkan nombor antara 100 dan 900 untuk lebih tepat mengawal betapa tebal teks itu muncul. Untuk membuang format tebal, pilih Normal atau Lighter.

• Font-Size: Tentukan saiz teks. Anda boleh memilih ukuran angka tertentu atau saiz relatif. Pilihan saiz ialah piksel (px), titik (pt), pica (pc), peratus (%), em, rem, bekas, dan ch. Piksel, ems, dan peratusan adalah pilihan yang paling biasa digunakan untuk saiz teks.

• Line-Height: Tentukan ketinggian baris di mana teks diletakkan. Sama seperti saiz teks, anda boleh menentukan ketinggian baris dalam pelbagai cara, termasuk piksel, em, dan peratusan. Ini adalah amalan yang baik di web untuk menambah ketinggian baris kerana meningkatkan ruang di sekitar teks anda menjadikannya lebih mudah dibaca pada skrin komputer.

• Teks-Align: Jajarkan kiri, sejajar dengan betul, tengah, atau semak teks anda dengan mengklik ikon yang sepadan. Ikon pertama, untuk Inherit, adalah lalai. Contohnya, anda boleh memusatkan teks di footer halaman web anda dengan memasukkan teks-Align set ke Pusat dalam definisi gaya yang anda gunakan pada tag di bahagian bawah halaman.

• Tekstur-Dekorasi: Tentukan sama ada teks digariskan, digariskan, dipaparkan dengan penyerang, atau dipaparkan dengan kesan berkedip.Anda juga boleh memilih None, yang sering digunakan untuk menghapus garis bawah dari teks yang dipautkan.

• Teks-Inden: Tentukan jumlah teks yang akan diinden dari sebelah kiri halaman dengan memasukkan nombor dalam salah satu pilihan saiz, seperti piksel, em, atau peratusan.

Mengapa begitu banyak fon?

Anda mungkin pernah mendengar bahawa anda kini boleh menggunakan font yang anda inginkan pada halaman web anda, terima kasih kepada versi terkini Cascading Style Sheets, CSS3. Pernyataan ini adalah benar tetapi dengan beberapa batasan: Anda mesti mempunyai hak undang-undang untuk menerbitkan fon, dan fon mesti dihoskan di pelayan web.

Untuk membantu memastikan teks anda muncul seperti yang anda inginkan, Dreamweaver termasuk koleksi fon yang paling biasa pada komputer Windows dan Macintosh. Fon ini dikumpulkan dalam keluarga, seperti

• Gotham, Helvetica Nue, Helvetica, Arial, sans serif

• Cambria, Teks Hoefler, Serif Pembebasan, Times, Times New Roman, Times, dan serif

Anda boleh membuat koleksi font anda sendiri menggunakan kotak dialog Urus Font, yang boleh diakses dengan memilih pilihan Urus Font di bahagian bawah senarai jatuh turun Font-Family dalam panel Teks dalam panel Designer CSS.

Seksyen Teks-Bayangan dalam panel Teks

Bahagian Teks-Bayangan panel Teks menyediakan alat untuk menambah bayang-bayang teks, salah satu sifat CSS terbaru yang termasuk dalam definisi CSS3. Pilihan yang paling popular adalah seperti berikut:

• H-shadow: Tambahkan bayangan pada teks anda pada paksi mendatar. Pertama pilih pilihan saiz, dan kemudian masukkan nombor dalam medan. Sebagai contoh, masukkan 2px, untuk menambah bayang mendatar yang lebar 2 piksel.

• V-shadow: Tambahkan bayangan pada teks anda pada paksi menegak. Pertama pilih pilihan saiz, dan kemudian masukkan nombor dalam medan.

• Blur: Kawal jumlah kabur dalam bayangan. Semakin besar bilangannya, lebih banyak bayangan itu tersebar, atau kabur.

• Warna: Masukkan kod warna heksadesimal untuk menentukan warna bayang-bayang, atau gunakan eyedropper untuk mencuba apa-apa warna pada skrin.

  

Ciri-ciri di bahagian bawah panel Teks, yang tidak biasa dengan pilihan panel Teks yang lain, adalah seperti berikut:

• Teks-Transform: Ubah kes teks anda. Pilihan adalah Modal, Huruf besar, dan huruf kecil. Klik ikon yang sepadan untuk menetapkan harta ini.

• Letter-Spacing: Menentukan jumlah ruang putih yang dimasukkan antara huruf. Pilihan saiz ialah piksel (px), titik (pt), pica (pc), peratus (%), em, rem, bekas, dan ch.

• Word-Spacing: Menentukan jumlah ruang putih yang dimasukkan antara kata-kata. Pilihan saiz ialah piksel (px), titik (pt), pica (pc), peratus (%), em, rem, bekas, dan ch. (Lihat sidebar yang terdahulu "Membandingkan pilihan saiz CSS.")

• White-Space: Beritahu pelayar bagaimana untuk menangani rehat baris dan ruang dalam blok teks. Pilihan anda adalah Pewarisan, Normal, Nowrap, Pra, Pra-line, atau Pre-wrap. Nowrap sangat berguna kerana ia menghalang unsur daripada dipisahkan jika mereka mesti membungkus agar muat dalam tetingkap penyemak imbas atau bekas lain.

• Menegak-Menegak: Sejajar unsur-unsur sebaris, seperti teks dan imej, berhubung dengan unsur-unsur yang mengelilinginya. Anda boleh menetapkan nilai angka atau pilih Baseline, Sub, Super, Atas, Teks-Atas, Tengah, Bawah, dan Teks-Bawah.