Cara Edit Gaya dalam Tata CSS di Dreamweaver - dummies

Selepas anda membuat halaman baru dengan susun atur CSS dalam Dreamweaver, anda mempunyai bilangan pilihan yang tidak terhingga untuk mengeditnya, tetapi terlebih dahulu anda perlu menentukan gaya dalam helaian gaya sesuai dengan elemen yang ingin anda edit.

Seperti yang anda mungkin bayangkan, anda boleh mengedit gaya dalam susun atur CSS dalam banyak cara untuk membuat reka bentuk anda sendiri.

Selepas anda menyesuaikan gaya sedia ada untuk mendapatkan reka bentuk halaman asas dengan cara yang anda inginkan, anda boleh membuat sebanyak mungkin gaya tambahan yang anda inginkan.

Bagaimana untuk menyemak gaya yang ada dan membuat pengeditan asas

Anda boleh menggunakan arahan asas yang sama dengan susun atur CSS yang termasuk dalam Dreamweaver. Untuk mengedit gaya dalam susun atur CSS, ikuti langkah-langkah berikut:

1. Buka fail halaman yang berasaskan susun atur CSS Dreamweaver, dan pilih Tetingkap → Gaya CSS (atau klik tab Designer CSS untuk mengembangkan panel).

   Panel Pereka CSS dibuka atau berkembang.

2. Klik untuk memilih nama helaian gaya di panel Sumber di bahagian atas Designer CSS.

   Semua gaya yang berkaitan dengan halaman baru disenaraikan dalam panel Selectors.

   

3. Pilih nama mana-mana gaya yang disenaraikan dalam panel CSS Designer Selectors.

   Peraturan CSS yang sesuai untuk gaya dipaparkan dalam panel Properties, di bahagian bawah panel Designer CSS. Mengklik senarai gaya dan menyemak peraturan mereka adalah cara yang baik untuk mendapatkan gambaran ringkas mengenai reka bentuk dan untuk melihat di mana pelbagai pilihan pemformatan halaman disimpan.

Pengepala HTML5,. nav, dan tag footer mengawal bahagian utama halaman. Sebagai contoh, gaya header termasuk peraturan yang menjadikan warna latar belakang hijau. Oleh itu, untuk menukar warna kawasan pengepala di bahagian atas halaman, anda mengubah tetapan warna latar belakang dalam peraturan header.

Bagaimana untuk mengedit tetapan seluruh halaman

Untuk mengedit tetapan seluruh halaman - seperti warna latar belakang muka surat atau muka font utama, saiz, dan warna teks yang digunakan di seluruh halaman - ikuti langkah-langkah berikut:

1. Dalam panel Pemilih CSS Designer, pilih gaya yang bernama badan.

   Sifat yang ditakrifkan dalam peraturan gaya yang dipilih dipaparkan dalam panel Properties.

   

2. Klik ikon T di bahagian atas panel Properties, dan tukar atau tambah fon yang dikehendaki dan tetapan teks lain.

   Anda boleh menukar muka fon, saiz, gaya, dan berat badan. Untuk menukar ruang antara baris teks, ubah ketinggian baris.

3. Tatal ke bahagian Latar belakang panel Properties dan gunakan warna dengan baik dalam medan Warna Latar Belakang untuk menentukan warna untuk keseluruhan latar belakang halaman.

   Sebagai alternatif, anda boleh memasukkan sebarang kod warna heksadesimal dalam medan Warna Latar Belakang atau gunakan eyedropper untuk mencuba apa-apa warna. Untuk menambah imej latar belakang, klik pada medan URL di bahagian Latar Belakang dan kemudian klik butang Layari yang muncul dan pilih imej yang ingin anda layari sebagai latar belakang. Gunakan ikon Latar Belakang-Ulang untuk menentukan bagaimana imej latar belakang harus diulang pada halaman.

4. Jadikan sebarang perubahan atau penambahan lain pada peraturan gaya.

Perubahan kepada peraturan gaya dalam panel Properties disimpan secara automatik dan digunakan pada kandungan yang diformat dengan peraturan.

Bagaimana untuk menyesuaikan kawasan kandungan

Untuk menukar lebar atau tetapan lain kawasan kandungan utama, yang mengawal keseluruhan halaman dan header, footer, dan bar sisi keseluruhan, ikuti langkah berikut:

1. Untuk menukar lebar keseluruhan kawasan reka bentuk utama:

   1. Klik. gaya kontena dalam panel Selectors panel Designer CSS.

      Sifat-sifat. Peraturan gaya kontena dipaparkan dalam panel Properties, di mana anda juga boleh mengedit gaya.

   2. Tukar saiz dalam medan Lebar atau ketikkan nombor baru untuk lebar halaman yang anda inginkan.

      Lebar reka bentuk halaman diubah secara automatik berdasarkan saiz yang anda masukkan. Apabila anda menukar lebarnya. gaya kontena, anda mengubah lebar keseluruhan reka bentuk kerana semua tag dan elemen lain terkandung dalam format dengan. gaya kontena - dan mereka semua bersedia untuk mengembangkannya. bekas.

2. Untuk mengubah saiz kawasan kandungan halaman, pilih gaya bernama. kandungan dan nyatakan saiz dan pilihan lain yang anda inginkan dalam panel Properties.

   Jika anda menukar lebar kawasan kandungan dalam susun atur yang merangkumi bar sisi, anda mesti mengubah lebar sidebar juga.

3. Untuk menukar warna latar belakang mana-mana gaya pada halaman, klik nama gaya yang sama dan ubah tetapan dalam bahagian Latar belakang panel Properties.

   Sebagai contoh, dalam susun atur CSS dalam Dreamweaver, bar sisi ditakrifkan dalam gaya bernama. sidebar1. Oleh itu, untuk menukar warna latar belakang, anda akan klik. sidebar1 dalam panel Selectors, pilih kategori Latar belakang dalam panel Properties, dan pilih warna yang anda mahu. Begitu juga, untuk menukar warna latar belakang header, pilih gaya bernama header di panel Selectors dan menggunakan warna dengan baik.

   

4. Untuk menambah imej ke tajuk:

   1. Pilih imej ruang letak yang dilabelkan Masukkan Logo dan tekan kekunci Delete atau Backspace.

   2. Pilih Insert → Imej → Imej dan pilih imej menggunakan kotak dialog Sumber Pilih Imej.

5. Gantikan teks dan masukkan imej di bar sisi dan kandungan utama.

   Anda boleh menambah atau menggantikan teks dan memasukkan imej dalam mana-mana halaman yang dibuat dari susun atur CSS, sama seperti yang anda lakukan pada halaman web yang lain.

6. Pilih Fail → Simpan Semua untuk menyimpan halaman dan gaya.