RSS

Membuat Frame pada Dreamweaver

Membuat Frame pada Dreamweaver

Setelah mengetahui fungsi frame, sekarang saatnya untuk berlatih membuat frame. Untuk mempermudah dalam proses belajar akan dijelaskan secara bertahap untuk membuat frame seperti gambar dibawah.

Berikut langkah-langkah untuk membuat frame seperti gambar di atas  :

Image and video hosting by TinyPic
Gambar Contoh Frame

1.            Klik di halaman yang ingin anda sisipi
frame.

Image and video hosting by TinyPic
Gambar mengklik halaman yang ingin disisipi frame

2.            Klik Insert > HTML > Frames > Top untuk menampilkan kotak dialog Frame Tag Accessibility Attributes.


Image and video hosting by TinyPic
Gambar untuk menampilkan frame

3.        Setelah kotak dialog Frame Tag Accessibility Attributes muncul, pilih topframe untuk mengisi kolom frame.

Image and video hosting by TinyPic
Gambar mengisi frame dengan topframe


4.            Klik  OK untuk menutup kotak dialog Frame Tag accessibility Attributes.

Image and video hosting by TinyPic
Gambar Tampilan frame atas


5.            Ketikkan kata sembarang di frame tersebut, misalnya diberi teks “Header”.


Image and video hosting by TinyPic
Gambar mengetik kata Header


6.        Halaman pun telah terbelah menjadi dua bagian, yaitu bagian atas dan bagian bawah. Selanjutnya, kotak bagian bawah akan dibelah menjadi 2 bagian lagi. Untuk itu, klik di kotak bagian bawah seperti berikut ini.


Image and video hosting by TinyPic
Gambar menempatkan kursor di kolom bagian bawah

7.        Klik Insert  >  HTML  >  Frames  >  Left  untuk menampilkan kotak dialog Frame Tag Accesibility Attributes.

8.        Setelah koyak dialog Frame Tag accessibility Attributes muncul, pilih leftFrame untuk mengisi kolom frame.

Image and video hosting by TinyPic
Gambar memilih leftframe untuk diisikan dalam kolom frame


9.            Klik  OK  untuk menutup kotak dialog Frame Tag Accesibility Attributes.

Image and video hosting by TinyPic
Gambar tampilkan kolom bawah setelah terbagi menjadi 2 bagian


10.          Ketikkan teks apa saja di kolom bawah bagian kiri, misalnya “Navigation”.

11.          Ketikkan teks untuk kolom bawah bagian kanan, missal “Kontent”.

Image and video hosting by TinyPic
Gambar memasukkan kata ke dalam kolom bawah bagian kiri dan kanan

  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

0 komentar:

Posting Komentar