P. 1
Seri Tutorial Dreamweaver 8 - Membuat Menu Dengan CSS (free)

Seri Tutorial Dreamweaver 8 - Membuat Menu Dengan CSS (free)

4.75

|Views: 10,993|Likes:
Dipublikasikan oleh Achmad Solichin
Seri Tutorial Dreamweaver 8 - Membuat Menu Dengan CSS (free)
Seri Tutorial Dreamweaver 8 - Membuat Menu Dengan CSS (free)

More info:

Published by: Achmad Solichin on May 21, 2008
Hak Cipta:Attribution Non-commercial

Availability:

Read on Scribd mobile: iPhone, iPad and Android.
download as PDF, TXT or read online from Scribd
See more
See less

01/02/2015

pdf

text

original

Seri Dream mwever 8 [M MEMBUAT MENU DE T ENGAN CS SS

]

Ser Tutoria Dreamw ri al weaver 8 MEM MBUAT M MENU DENGAN CS SS
Menu atau navig di sebua website m u gasi ah memegang p peranan yan sangat pe ng enting. Fungsi utam manya adala memuda ah ahkan peng gunjung untuk menda apatkan informasi yan ng diinginkan. Deng menu atau navigas yang baik, pengunjun dapat de gan si , ng engan muda ah berpi indah dari satu halaman ke halama yang lainn Sebaliknya, navigas yang buru n an nya. si uk akan membingun ngkan pengu unjung, sehi ingga bisa m menyebabkan pengunjung “tersesat t” dan jika pengun njung tersebut tidak d dapat mene emukan “jal lan pulang” kembali k ” ke halam awal, maka bisa dip man m pastikan akan langsung m n meninggalka website kita (close). an Banyak bentuk dan teknik ya dapat di ang igunakan un ntuk membu menu ata navigasi d uat au di halam man web. Beberapa d diantaranya mengguna akan tabel, mengguna akan images, meng ggunakan ob bject flash, d juga me dan enggunakan CSS. Masing g‐masing teknik memilik ki keleb bihan dan ke ekurangan m masing‐masin ng. Dalam tutorial ini akan dis m i sampaikan bagaimana membuat m menu (navig gasi) denga an meng ggunakan CSS. Salah s C satu keuntu ungan menu menggunakan CSS a u adalah dapa at ditam mpilkan den ngan cepat oleh brow wser dan ju uga hampir semua bro owser dapa at mena ampilkannya (support‐al a ll‐browsers). . kut ah‐langkah m membuat me CSS den enu ngan Dreamw weaver 8. Berik ini langka 1. Buatlah halaman baru d dengan nam “menu.h ma html” melalui menu File > New d di Dreamweave D er.

Achmad Solichin, S.Kom | Univ d versitas Budi Luhur - Jak i karta 1

Seri Dream mwever 8 [M MEMBUAT MENU DE T ENGAN CS SS] Se elanjutnya simpan dulu halaman sebagai “menu s u.html”. Klik menu File > Save As…, k pilih lokasi pe enyimpanan file dan ketikkan nama filenya. 2. Buatlah sebu div deng cara me uah gan eng‐klik tom mbol “Insert div tag” yang berada d di menu Layout. Berikan nama pada div tersebut de m v engan nama “menu”. a

3. Buatlah sebuah daftar menu (navigasi) dengan m menggunaka unordered‐list (ul) da an an buatlah link untuk masing u g‐masing list menu. t

Achmad Solichin, S.Kom | Univ d versitas Budi Luhur - Jak i karta 2

Seri Dreamwever 8 [M m MEMBUAT MENU DE T ENGAN CS SS]

Achmad Solichin, S.Kom | Univ d versitas Budi Luhur - Jakarta 3 i k

Seri Dream mwever 8 [M MEMBUAT MENU DE T ENGAN CS SS]

4. Buatlah sebuah CSS Rule baru pada d menu. div

Achmad Solichin, S.Kom | Univ d versitas Budi Luhur - Jakarta 4 i k

Seri Dreamwever 8 [M m MEMBUAT MENU DE T ENGAN CS SS]

Achmad Solichin, S.Kom | Univ d versitas Budi Luhur - Jakarta 5 i k

Seri Dream mwever 8 [M MEMBUAT MENU DE T ENGAN CS SS]

5. Buatlah sebuah CSS Rule baru untuk tag ul

Achmad Solichin, S.Kom | Univ d versitas Budi Luhur - Jakarta 6 i k

Seri Dreamwever 8 [M m MEMBUAT MENU DE T ENGAN CS SS]

Achmad Solichin, S.Kom | Univ d versitas Budi Luhur - Jakarta 7 i k

Seri Dream mwever 8 [M MEMBUAT MENU DE T ENGAN CS SS]

6. Buatlah sebuah CSS Rule baru untuk tag li

Achmad Solichin, S.Kom | Univ d versitas Budi Luhur - Jakarta 8 i k

Seri Dreamwever 8 [M m MEMBUAT MENU DE T ENGAN CS SS]

Achmad Solichin, S.Kom | Univ d versitas Budi Luhur - Jakarta 9 i k

Seri Dream mwever 8 [M MEMBUAT MENU DE T ENGAN CS SS]

7. Buatlah sebuah CSS Rule baru untuk tag a

Achmad Solichin, S.Kom | Univ d versitas Budi Luhur - Jakarta 10 i k

Seri Dreamwever 8 [M m MEMBUAT MENU DE T ENGAN CS SS]

Achmad Solichin, S.Kom | Univ d versitas Budi Luhur - Jakarta 11 i k

Seri Dreamwever 8 [M m MEMBUAT MENU DE T ENGAN CS SS]

Achmad Solichin, S.Kom | Univ d versitas Budi Luhur - Jakarta 12 i k

Seri Dream mwever 8 [M MEMBUAT MENU DE T ENGAN CS SS]

8. Buatlah sebuah CSS Rule baru untuk tag a:hover

Achmad Solichin, S.Kom | Univ d versitas Budi Luhur - Jakarta 13 i k

Seri Dreamwever 8 [M m MEMBUAT MENU DE T ENGAN CS SS]

Achmad Solichin, S.Kom | Univ d versitas Budi Luhur - Jakarta 14 i k

Seri Dream mwever 8 [M MEMBUAT MENU DE T ENGAN CS SS]

9. Preview hasilnya di Brow wser.

Achmad Solichin, S.Kom | Univ d versitas Budi Luhur - Jak i karta 15

You're Reading a Free Preview

Mengunduh
scribd
/*********** DO NOT ALTER ANYTHING BELOW THIS LINE ! ************/ var s_code=s.t();if(s_code)document.write(s_code)//-->