1. Hapus garis bawah hyperlink dan lakukan perubahan warna saat mengarahkan mouse:
Secara default, hyperlink di halaman web yang dirancang dengan DreamWeaver digarisbawahi, yang tidak terlihat terlalu indah. Untuk menghilangkan garis bawah yang mengganggu ini, metode yang diperkenalkan di banyak surat kabar dan majalah adalah dengan menambahkan sepotong kode ke kode sumber HTML secara manual. Faktanya, menghapus garis bawah pada tautan di DreamWeave sangatlah mudah. Pertama, buat tautan acak di Dokumen Windows DreamWeaver. Anda dapat melihat bahwa tautan ini akan digarisbawahi. Bagaimana cara menghilangkan garis bawah ini?
1. Klik "Text" |. "CSS Styles" |. "Edit Style Sheet..." pada menu bar (atau langsung tekan tombol shortcut Ctrl+shift+E) untuk memunculkan Edit Style Sheet (edit style sheet) jendela dialog.
2. Klik "Baru", lalu di kotak dialog "Gaya Baru", klik tombol "Gunakan Pemilih CSS".
3. Ketik a di kolom Selector, lalu klik OK.
4. Kemudian muncul kotak dialog "CSS Style Definition". Pada dekorasi kelas Type, centang none, lalu klik OK, lalu klik Done. Anda akan segera melihat bahwa garis bawah tautan telah hilang di Dokumen Windows. Lalu bagaimana cara membuat link berubah warna saat mouse diarahkan ke atasnya? Ulangi langkah pertama dan kedua pada langkah di atas. Lalu klik panah drop-down di samping Selector, pilih "a:hover", dan klik OK. Di kotak dialog "Definisi gaya untuk: hover" yang muncul, pilih warna apa pun dalam warna kelas Tipe (misalnya, pilih merah), lalu klik OK, lalu klik Selesai untuk menyelesaikan. Tekan F12 untuk melihat pratinjau dan letakkan mouse pada tautan. Apakah tautan berubah menjadi merah? Jika pada kotak dialog "Definisi gaya untuk: hover" tadi, di kelas Latar Belakang, pilih warna latar belakang sebagai hijau, lalu ketika Anda meletakkan mouse pada hyperlink, link tidak hanya akan berubah menjadi merah, tetapi juga akan ada latar belakang hijau. Faktanya, melalui kotak dialog definisi gaya CSS tadi, Anda juga dapat memperoleh lebih banyak efek khusus. Teman yang tertarik mungkin ingin memikirkannya.
2. Buat style sheet CSS eksternal yang dapat digunakan kembali.
Setelah menggunakan DreamWeaver untuk membuat style CSS di halaman web tertentu, jika Anda ingin menerapkan style tersebut ke halaman web lain, Anda tidak perlu membuat ulang style CSS tersebut saat Anda membuat file lembar gaya CSS eksternal (lembar gaya CSS eksternal), Anda dapat memanggil gaya dalam file lembar gaya ini sesuka hati di masa mendatang. Untuk memudahkan pengelolaannya, pertama-tama buatlah folder baru di folder tempat situs tersebut berada, bernama CSS, yang khusus digunakan untuk menempatkan file style sheet eksternal (ekstensinya css).
1. Tekan Ctrl+shift+E di Jendela Dokumen untuk membuka jendela dialog Edit Style Sheet.
2. Klik "link".
3. Pada kotak dialog pop-up Link External Style Sheet, klik BROWSE dan temukan folder CSS yang baru saja Anda buat.
4. Pada kolom "File Name" pada jendela Select Stylesheet File, ketik *.css (*bisa nama apa saja). Perlu diketahui bahwa sebenarnya tidak ada file style sheet di folder CSS saat ini ketik di kolom "Nama File" akan menjadi nama file style sheet eksternal baru. Misalnya, ketik title.css, lalu klik Pilih |.
5. Pada jendela dialog Edit Style Sheet, title.css (link) akan ditambahkan, klik dua kali.
6. Di jendela pop-up "title.css", klik "Baru".
7. Pada kotak dialog “New Style”, klik tombol “Make Custom Style (class)”.
8. Ketikkan nama pada kolom Name, misalnya myheadline, lalu klik OK.
9. Pada kotak dialog "Definisi gaya untuk .myheadline in title.css" berikut, buat berbagai pengaturan seperti font dan warna, dan klik OK setelah selesai. Jika Anda ingin membuat style baru, klik "Baru" lagi, ulangi langkah 6, 7, 8, dan 9, dan terakhir klik "simpan" | "selesai", dan file style sheet eksternal title.css akan dibuat. Semua gaya di title.css akan dicantumkan di submenu "TEXT" |. "CSS Styles" pada bilah menu. Jika Anda ingin memanggil title.css ini di halaman web lain, cukup ulangi langkah 1 hingga 3 di atas, lalu masukkan title.css di kolom "Nama File" pada jendela Select Stylesheet File. Klik "pilih" |. "ok" |. "selesai", semua gaya di title.css akan muncul di submenu "Teks" |. "Gaya CSS" pada bilah menu halaman web, dan Anda akan dapat menerapkannya ke halaman web ini gaya ini.