SlideShare a Scribd company logo
1 of 29
PERTEMUAN 2
HTML (Lanjutan)
Tag dan Elemen HTML
Penanda perintah di dalam HTML biasanya disebut TAG.
TAG digunakan untuk menentukan tampilan dari halaman HTML.
Tag ada yang perpasangan :
<BEGIN TAG> isi dokumen</END TAG>
Tag ada yang tidak berpasangan
<TAG> isi dokumen
Sumber : http://html.net
Umumnya elemen terdiri dari tag awal, dengan satu atau lebih atribut,
beberapa konten dan tag akhir.
Paragraf dan Peformatan Teks
Penulisan paragraf bisa menggunakan tag <p>. Untuk
memformat tulisan/teks bisa menggunakan berbagai macam tag
sesuai keperluan diantaranya,
Tag Deskripsi
<b> Membuat teks tercetak tebal
<i> Membuat teks miring
<small> Membuat teks tercetak kecil
<strong> Menyatakan teks tersebut penting
<sub> Membuat teks tercetak sebagai subscript
<sup> Membuat teks tercetak sebagai superscript (pangkat)
<del> Menyatakan teks yang diapit tag <del> itu dihapus (dicoret)
<mark> Menyatakan teks yang ditandai (highlighted). Efeknya seperti tulisan
yang diberi stabilo
Contoh peformatan teks Simpan dengan nama teks.html
<HTML>
<HEAD>
<TITLE>Tipe-tipe Teks</TITLE>
</HEAD>
<BODY>
Ada tiga macam tipe tulisan yang paling sering digunakan dalam penulisan dokumen. <br>
Ketiga tipe tersebut ialah tulisan <B>tebal</B>, tulisan <I>miring</I> dan tulisan <U>bergaris
bawah</U>. <br>
Bahkan bisa pula ketiga tipe tulisan tersebut sekaligus bergabung menjadi satu berupa
tulisan<br>
<B><I><U>tebal, miring dan bergaris bawah</B></I></U>.
</BODY>
</HTML>
List
Untuk menampilkan daftar (List) dalam halaman web,
• Jika daftar tersebut tidak terurut (tampil
menggunakan bullet), maka tag yang digunakan
adalah <UL> yang berarti unordered list.
• Namun jika daftar tersebut penting urutannya
gunakan <OL> ordered list
Contoh Script HTML, LIST
Frame
Di dalam HTML ada dua cara buah dasar untuk mendesain layout
sebuah website yaitu frame dan tag div
Frame digunakan untuk membagi jendela browser menjadi beberapa
bagian terpisah
Untuk membuat sebuah frame, tag yang digunakan adalah :
• Tag <FRAMESET>
• Tag <FRAME>
Frameset adalah suatu frame induk yang dapat menampung beberapa
frame di dalamnya dan dapat memiliki frameset sendiri.
Sedangkan frame sendiri adalah dokumen yang terdapat di dalam
frameset dengan border yang mengelilinginya.
Tag FRAMESET
Membagi jendela browser menjadi beberapa bagian terpisah
<FRAMESET> memiliki beberapa atribut
Ada dua cara umum mendefinisikan lebar frame pada attribut ROWS dan COLS yaitu
nilai tetap (fix), nilai persentase,
contohnya membuat empat buah frame :
Dengan nilai tetap (berdasarkan resolusi)
<FRAMESET ROWS=“50,140,400,50”>
Dengan nilai persentase (berdasarkan lebar jendela browser)
<FRAMESET ROWS=“20%,40%,20%,20%”>
Atribut Keterangan
ROWS Membuat frame secara horizontal sekaligus mendefinisikan lebar
masing-masing
COLS Membuat frame secara vertikal sekaligus mendefinisikan lebar
masing-masing
BORDERCOLOR Menentukan warna bingkai frame
Tag Frame
Tag <FRAME> mempunyai atribut
Atribut Keterangan
SRC Menentukan nama file HTML yang digunakan isi frame
MARINHEIGHT Menentukan batas kiri dan kanan antara dokumen dengan bingkai
dalam pixel
NAME Mendefenisikan nama dari objek frame. Nama ini dapat digunakan
sebagai tujuan sebuah link
BORDER Menentukan ukuran bingkai frame
Membagi halaman menjadi 2 Frame
Simpan dengan nama framekiri.html
Simpan dengan nama framekanan.html
Simpan dengan nama frame.html
Tampilan eksekusi frame.html
Membagi halaman menjadi 4 frame
Script homepage.html
Menu.html
Menu2.html
Link
Link merupakan gambar atau teks yang terkait dengan suatu alamat tertentu,
ditandai dengan Anchor, yaitu tag <A>
Tag <A> mempunyai dua atribut, yaitu HREF (anchor untuk sebuah link) dan NAME
(anchor untuk tujuan).
Gambar
Untuk menambahkan gambar gunakan tag <IMG>
Atribut keterangan
SRC Menunjukkan URL tau direktori tempat file gambar berada
WIDTH Lebar gambar (dalam pixel)
HEIGHT Tinggi gambar (dalam pixel)
ALIGN Posisi teks disekitar gambar (TOP, MIDDLE, BOTTOM, LEFT, RIGHT)
ALT Menampilkan teks pengganti gambar jika tidak tampil
Form
Form adalah sebuah daftar isian, untuk meminta informasi dari
user untuk kemudian diolah. Pengolahan dilakukan pada server
yang menggunakan skrip yang bersifat server side
Tag yang diperlukan untuk membuat form :
1. Tag <form>
2. Tag <TEXTAREA>
3. Tag <SELECT>
4. Tag <INPUT>
1. Tag Form
Tag <FORM> yang digunakan untuk mendefenisikan sebuah form.
Mempunyai dua atribut yaitu METHODE dan ACTION.
Atribut Action
METHODE Untuk menentukan metode pengolahan form. Pilihan method adalah GET atau
POST
ACTION Untuk menentukan URL atau lokasi dari file yang digunakan untuk mengolah
form tersebut
2. Tag Textarea
Tag <TEXTAREA> digunakan untuk membuat sebuah kotak teks multibaris.
Beberapa atributnya :
Atribut Action
NAME Mendefenisikan nama textarea
ROWS Menentukan jumlah baris teks area
COLS Menentukan lebar dari textarea
3. Tag Select
Tag <SELECT> digunakan untuk membuat sebuah daftar pilihan.
Atribut Action
NAME Mendefenisikan nama objek select
DISABLED Menentukan apa dropdown list tidak diaktifkan
SIZE Menentukan berapa pilihan yang akan ditampilkan
3. Tag Input
Tag <INPUT> digunakan untuk membuat elemen-elemen untuk meminta
informasi dari user, misalnya kotak teks, kotak pilihan, tombol dll
Tipe input
Atribut Action
NAME Mendefenisikan nama dari elemen input, atribut dituliskan kecuali untuk tipe
submit dan clear
SIZE Menentukan lebar elemen input
MAXLENGHT Menentukan maksimum karakter yang dapat dimasukkan kedalam elemen
input
VALUE Untuk kotak teks, menentukan teks yang tertulis
Untuk check box atau radio, menentukan nilai item yang dipilih
Untuk submit dan reset, menentukan teks yang tertulis pada tombol
TYPE Menentukan tipe input yang dibuat
Tipe input :
• Text, membuat kotak teks
• Password, membuat kotak teks, ditampilkan dengan tanda *
• Check box, membuat suatu pilihan, yang dapat dipilih lebih
dari satu
• Radio, membuat daftar pilihan, yang hanya dapat dipilih satu
• Reset, membuat tombol yang fungsinya untuk menghapus
semua isian form.
• Submit, membuat tombol yang fungsinya mengirim data form
untuk diolah.
Contoh form input html
Colspan dan Rowspan
Colspan adalah menggabungkan beberapa kolom cell menjadi satu cell
Rowspan adalah menggabungkan beberapa baris cell menjadi satu cell
sumber
Priyanto hidayatullah “pemograman web 2014”
html.net
php.net
Wikipedia
dll

More Related Content

What's hot

DOWNLOAD CARA MEMBUAT HTML
DOWNLOAD CARA MEMBUAT HTMLDOWNLOAD CARA MEMBUAT HTML
DOWNLOAD CARA MEMBUAT HTMLVictor Dilingham
 
Andino Maseleno - Modul Web Programming
Andino Maseleno - Modul Web ProgrammingAndino Maseleno - Modul Web Programming
Andino Maseleno - Modul Web ProgrammingAndino Maseleno
 
Fungsi fungsi icon microsoft word
Fungsi fungsi icon microsoft wordFungsi fungsi icon microsoft word
Fungsi fungsi icon microsoft wordfaqih74
 
MENGOLAH DATABASE
MENGOLAH DATABASEMENGOLAH DATABASE
MENGOLAH DATABASEmurma
 
tugas tik indah tab home - view
tugas tik indah tab home - view tugas tik indah tab home - view
tugas tik indah tab home - view indah_rpi
 
Fungi menu dan ikon microsoft excel
Fungi menu dan ikon microsoft excelFungi menu dan ikon microsoft excel
Fungi menu dan ikon microsoft excelDOLI SYAHPUTRA, ST
 
Html dasar
Html dasarHtml dasar
Html dasarfhnx
 
Fungsi menu dan ikon pada microsoft excel 2007
Fungsi menu dan ikon pada microsoft excel 2007Fungsi menu dan ikon pada microsoft excel 2007
Fungsi menu dan ikon pada microsoft excel 2007Yang Terluka
 

What's hot (16)

DOWNLOAD CARA MEMBUAT HTML
DOWNLOAD CARA MEMBUAT HTMLDOWNLOAD CARA MEMBUAT HTML
DOWNLOAD CARA MEMBUAT HTML
 
Andino Maseleno - Modul Web Programming
Andino Maseleno - Modul Web ProgrammingAndino Maseleno - Modul Web Programming
Andino Maseleno - Modul Web Programming
 
Modul web affif
Modul web affifModul web affif
Modul web affif
 
Fungsi fungsi icon microsoft word
Fungsi fungsi icon microsoft wordFungsi fungsi icon microsoft word
Fungsi fungsi icon microsoft word
 
MENGOLAH DATABASE
MENGOLAH DATABASEMENGOLAH DATABASE
MENGOLAH DATABASE
 
Praktek
PraktekPraktek
Praktek
 
tugas tik indah tab home - view
tugas tik indah tab home - view tugas tik indah tab home - view
tugas tik indah tab home - view
 
Fungi menu dan ikon microsoft excel
Fungi menu dan ikon microsoft excelFungi menu dan ikon microsoft excel
Fungi menu dan ikon microsoft excel
 
Html dasar
Html dasarHtml dasar
Html dasar
 
Fungsi menu dan ikon pada microsoft excel 2007
Fungsi menu dan ikon pada microsoft excel 2007Fungsi menu dan ikon pada microsoft excel 2007
Fungsi menu dan ikon pada microsoft excel 2007
 
Html
HtmlHtml
Html
 
Modul HTML5
Modul HTML5Modul HTML5
Modul HTML5
 
4 sql
4 sql4 sql
4 sql
 
Modul 2a html
Modul 2a htmlModul 2a html
Modul 2a html
 
MENU DAN IKON MS.EXCEL
MENU DAN IKON MS.EXCELMENU DAN IKON MS.EXCEL
MENU DAN IKON MS.EXCEL
 
Menu bar
Menu barMenu bar
Menu bar
 

Similar to Pertemuan 2 a

Presentasi konsep dasar html
Presentasi konsep dasar htmlPresentasi konsep dasar html
Presentasi konsep dasar htmlDedy Setiawan
 
Materi_8_-_Pengenalan_HTML_-_Revisi.ppt
Materi_8_-_Pengenalan_HTML_-_Revisi.pptMateri_8_-_Pengenalan_HTML_-_Revisi.ppt
Materi_8_-_Pengenalan_HTML_-_Revisi.pptcharismacholilia1
 
Materi_8_-_Pengenalan_HTML_-_Revisi.ppt
Materi_8_-_Pengenalan_HTML_-_Revisi.pptMateri_8_-_Pengenalan_HTML_-_Revisi.ppt
Materi_8_-_Pengenalan_HTML_-_Revisi.pptcigugurfree
 
Praktikum_Pengenalan_HTML
Praktikum_Pengenalan_HTML Praktikum_Pengenalan_HTML
Praktikum_Pengenalan_HTML fikrinurfahmi1
 
dokumen.tips_presentasi-konsep-dasar-html.pptx
dokumen.tips_presentasi-konsep-dasar-html.pptxdokumen.tips_presentasi-konsep-dasar-html.pptx
dokumen.tips_presentasi-konsep-dasar-html.pptxAndreianYusuf
 
Cara membuat frame html
Cara membuat frame htmlCara membuat frame html
Cara membuat frame htmlFikri Pandoez
 
Praktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.ppt
Praktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.pptPraktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.ppt
Praktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.pptNansyeDeboraLitaay
 
Materi_Pengenalan_HTML_Revisi.ppt
Materi_Pengenalan_HTML_Revisi.pptMateri_Pengenalan_HTML_Revisi.ppt
Materi_Pengenalan_HTML_Revisi.pptReynaldiAzhar1
 
Laporan tugas project pemograman web
Laporan tugas project pemograman webLaporan tugas project pemograman web
Laporan tugas project pemograman webZansa Sllw Gymbr
 
Tugas2 1300631019
Tugas2 1300631019Tugas2 1300631019
Tugas2 1300631019setiyo muji
 
4 basic html form
4 basic html form4 basic html form
4 basic html formM Stalaktit
 
materi html xii mm.ppt
materi html xii mm.pptmateri html xii mm.ppt
materi html xii mm.pptwafiilyas2
 
Tabel Tag HTML
Tabel Tag HTMLTabel Tag HTML
Tabel Tag HTMLFajar Sany
 
PPT_HTML_DASAR.pptx
PPT_HTML_DASAR.pptxPPT_HTML_DASAR.pptx
PPT_HTML_DASAR.pptxFAUZY38
 
Presentation 1 - Desain dan pemrograman web 2
Presentation 1 - Desain dan pemrograman web 2Presentation 1 - Desain dan pemrograman web 2
Presentation 1 - Desain dan pemrograman web 2Jacob Dwi Cristian Umboh
 

Similar to Pertemuan 2 a (20)

Presentasi konsep dasar html
Presentasi konsep dasar htmlPresentasi konsep dasar html
Presentasi konsep dasar html
 
Materi_8_-_Pengenalan_HTML_-_Revisi.ppt
Materi_8_-_Pengenalan_HTML_-_Revisi.pptMateri_8_-_Pengenalan_HTML_-_Revisi.ppt
Materi_8_-_Pengenalan_HTML_-_Revisi.ppt
 
Materi_8_-_Pengenalan_HTML_-_Revisi.ppt
Materi_8_-_Pengenalan_HTML_-_Revisi.pptMateri_8_-_Pengenalan_HTML_-_Revisi.ppt
Materi_8_-_Pengenalan_HTML_-_Revisi.ppt
 
Praktikum_Pengenalan_HTML
Praktikum_Pengenalan_HTML Praktikum_Pengenalan_HTML
Praktikum_Pengenalan_HTML
 
dokumen.tips_presentasi-konsep-dasar-html.pptx
dokumen.tips_presentasi-konsep-dasar-html.pptxdokumen.tips_presentasi-konsep-dasar-html.pptx
dokumen.tips_presentasi-konsep-dasar-html.pptx
 
Web html
Web htmlWeb html
Web html
 
Cara membuat frame html
Cara membuat frame htmlCara membuat frame html
Cara membuat frame html
 
Praktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.ppt
Praktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.pptPraktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.ppt
Praktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.ppt
 
Materi_Pengenalan_HTML_Revisi.ppt
Materi_Pengenalan_HTML_Revisi.pptMateri_Pengenalan_HTML_Revisi.ppt
Materi_Pengenalan_HTML_Revisi.ppt
 
Modul 1 - HTML
Modul 1 - HTMLModul 1 - HTML
Modul 1 - HTML
 
Laporan tugas project pemograman web
Laporan tugas project pemograman webLaporan tugas project pemograman web
Laporan tugas project pemograman web
 
Tugas2 1300631019
Tugas2 1300631019Tugas2 1300631019
Tugas2 1300631019
 
4 basic html form
4 basic html form4 basic html form
4 basic html form
 
materi html xii mm.ppt
materi html xii mm.pptmateri html xii mm.ppt
materi html xii mm.ppt
 
Tabel Tag HTML
Tabel Tag HTMLTabel Tag HTML
Tabel Tag HTML
 
PPT_HTML_DASAR.pptx
PPT_HTML_DASAR.pptxPPT_HTML_DASAR.pptx
PPT_HTML_DASAR.pptx
 
Presentation 1 - Desain dan pemrograman web 2
Presentation 1 - Desain dan pemrograman web 2Presentation 1 - Desain dan pemrograman web 2
Presentation 1 - Desain dan pemrograman web 2
 
PPT_HTML_DASAR.pptx
PPT_HTML_DASAR.pptxPPT_HTML_DASAR.pptx
PPT_HTML_DASAR.pptx
 
Download Kodr kode HTML
Download Kodr kode HTMLDownload Kodr kode HTML
Download Kodr kode HTML
 
Html
HtmlHtml
Html
 

More from f fr

Pertemuan java script 2
Pertemuan java script 2Pertemuan java script 2
Pertemuan java script 2f fr
 
Pertemuan java script 1
Pertemuan java script 1Pertemuan java script 1
Pertemuan java script 1f fr
 
Pertemuan 8 b
Pertemuan 8 bPertemuan 8 b
Pertemuan 8 bf fr
 
Pertemuan 8 a
Pertemuan 8 aPertemuan 8 a
Pertemuan 8 af fr
 
Pertemuan 7+++
Pertemuan 7+++Pertemuan 7+++
Pertemuan 7+++f fr
 
Pertemuan 7++
Pertemuan 7++Pertemuan 7++
Pertemuan 7++f fr
 
Pertemuan 7+
Pertemuan 7+Pertemuan 7+
Pertemuan 7+f fr
 
Pertemuan 6 7
Pertemuan 6 7Pertemuan 6 7
Pertemuan 6 7f fr
 
Pertemuan 5
Pertemuan 5Pertemuan 5
Pertemuan 5f fr
 
Pertemuan 4 c
Pertemuan 4 cPertemuan 4 c
Pertemuan 4 cf fr
 
Pertemuan 3 b
Pertemuan 3 bPertemuan 3 b
Pertemuan 3 bf fr
 
Pertemuan 3 a
Pertemuan 3 aPertemuan 3 a
Pertemuan 3 af fr
 
Pertemuan 2 b
Pertemuan 2 bPertemuan 2 b
Pertemuan 2 bf fr
 
Pertemuan 1 b
Pertemuan 1 bPertemuan 1 b
Pertemuan 1 bf fr
 
Pertemuan 1 a
Pertemuan 1 aPertemuan 1 a
Pertemuan 1 af fr
 
Pertemuan 1 a
Pertemuan 1 aPertemuan 1 a
Pertemuan 1 af fr
 
Pertemuan 1 a
Pertemuan 1 aPertemuan 1 a
Pertemuan 1 af fr
 

More from f fr (17)

Pertemuan java script 2
Pertemuan java script 2Pertemuan java script 2
Pertemuan java script 2
 
Pertemuan java script 1
Pertemuan java script 1Pertemuan java script 1
Pertemuan java script 1
 
Pertemuan 8 b
Pertemuan 8 bPertemuan 8 b
Pertemuan 8 b
 
Pertemuan 8 a
Pertemuan 8 aPertemuan 8 a
Pertemuan 8 a
 
Pertemuan 7+++
Pertemuan 7+++Pertemuan 7+++
Pertemuan 7+++
 
Pertemuan 7++
Pertemuan 7++Pertemuan 7++
Pertemuan 7++
 
Pertemuan 7+
Pertemuan 7+Pertemuan 7+
Pertemuan 7+
 
Pertemuan 6 7
Pertemuan 6 7Pertemuan 6 7
Pertemuan 6 7
 
Pertemuan 5
Pertemuan 5Pertemuan 5
Pertemuan 5
 
Pertemuan 4 c
Pertemuan 4 cPertemuan 4 c
Pertemuan 4 c
 
Pertemuan 3 b
Pertemuan 3 bPertemuan 3 b
Pertemuan 3 b
 
Pertemuan 3 a
Pertemuan 3 aPertemuan 3 a
Pertemuan 3 a
 
Pertemuan 2 b
Pertemuan 2 bPertemuan 2 b
Pertemuan 2 b
 
Pertemuan 1 b
Pertemuan 1 bPertemuan 1 b
Pertemuan 1 b
 
Pertemuan 1 a
Pertemuan 1 aPertemuan 1 a
Pertemuan 1 a
 
Pertemuan 1 a
Pertemuan 1 aPertemuan 1 a
Pertemuan 1 a
 
Pertemuan 1 a
Pertemuan 1 aPertemuan 1 a
Pertemuan 1 a
 

Pertemuan 2 a

  • 2. Tag dan Elemen HTML Penanda perintah di dalam HTML biasanya disebut TAG. TAG digunakan untuk menentukan tampilan dari halaman HTML. Tag ada yang perpasangan : <BEGIN TAG> isi dokumen</END TAG> Tag ada yang tidak berpasangan <TAG> isi dokumen
  • 3. Sumber : http://html.net Umumnya elemen terdiri dari tag awal, dengan satu atau lebih atribut, beberapa konten dan tag akhir.
  • 4. Paragraf dan Peformatan Teks Penulisan paragraf bisa menggunakan tag <p>. Untuk memformat tulisan/teks bisa menggunakan berbagai macam tag sesuai keperluan diantaranya, Tag Deskripsi <b> Membuat teks tercetak tebal <i> Membuat teks miring <small> Membuat teks tercetak kecil <strong> Menyatakan teks tersebut penting <sub> Membuat teks tercetak sebagai subscript <sup> Membuat teks tercetak sebagai superscript (pangkat) <del> Menyatakan teks yang diapit tag <del> itu dihapus (dicoret) <mark> Menyatakan teks yang ditandai (highlighted). Efeknya seperti tulisan yang diberi stabilo
  • 5. Contoh peformatan teks Simpan dengan nama teks.html <HTML> <HEAD> <TITLE>Tipe-tipe Teks</TITLE> </HEAD> <BODY> Ada tiga macam tipe tulisan yang paling sering digunakan dalam penulisan dokumen. <br> Ketiga tipe tersebut ialah tulisan <B>tebal</B>, tulisan <I>miring</I> dan tulisan <U>bergaris bawah</U>. <br> Bahkan bisa pula ketiga tipe tulisan tersebut sekaligus bergabung menjadi satu berupa tulisan<br> <B><I><U>tebal, miring dan bergaris bawah</B></I></U>. </BODY> </HTML>
  • 6. List Untuk menampilkan daftar (List) dalam halaman web, • Jika daftar tersebut tidak terurut (tampil menggunakan bullet), maka tag yang digunakan adalah <UL> yang berarti unordered list. • Namun jika daftar tersebut penting urutannya gunakan <OL> ordered list
  • 8.
  • 9. Frame Di dalam HTML ada dua cara buah dasar untuk mendesain layout sebuah website yaitu frame dan tag div Frame digunakan untuk membagi jendela browser menjadi beberapa bagian terpisah Untuk membuat sebuah frame, tag yang digunakan adalah : • Tag <FRAMESET> • Tag <FRAME> Frameset adalah suatu frame induk yang dapat menampung beberapa frame di dalamnya dan dapat memiliki frameset sendiri. Sedangkan frame sendiri adalah dokumen yang terdapat di dalam frameset dengan border yang mengelilinginya.
  • 10. Tag FRAMESET Membagi jendela browser menjadi beberapa bagian terpisah <FRAMESET> memiliki beberapa atribut Ada dua cara umum mendefinisikan lebar frame pada attribut ROWS dan COLS yaitu nilai tetap (fix), nilai persentase, contohnya membuat empat buah frame : Dengan nilai tetap (berdasarkan resolusi) <FRAMESET ROWS=“50,140,400,50”> Dengan nilai persentase (berdasarkan lebar jendela browser) <FRAMESET ROWS=“20%,40%,20%,20%”> Atribut Keterangan ROWS Membuat frame secara horizontal sekaligus mendefinisikan lebar masing-masing COLS Membuat frame secara vertikal sekaligus mendefinisikan lebar masing-masing BORDERCOLOR Menentukan warna bingkai frame
  • 11. Tag Frame Tag <FRAME> mempunyai atribut Atribut Keterangan SRC Menentukan nama file HTML yang digunakan isi frame MARINHEIGHT Menentukan batas kiri dan kanan antara dokumen dengan bingkai dalam pixel NAME Mendefenisikan nama dari objek frame. Nama ini dapat digunakan sebagai tujuan sebuah link BORDER Menentukan ukuran bingkai frame
  • 12. Membagi halaman menjadi 2 Frame Simpan dengan nama framekiri.html Simpan dengan nama framekanan.html
  • 13. Simpan dengan nama frame.html Tampilan eksekusi frame.html
  • 17.
  • 18. Link Link merupakan gambar atau teks yang terkait dengan suatu alamat tertentu, ditandai dengan Anchor, yaitu tag <A> Tag <A> mempunyai dua atribut, yaitu HREF (anchor untuk sebuah link) dan NAME (anchor untuk tujuan).
  • 19. Gambar Untuk menambahkan gambar gunakan tag <IMG> Atribut keterangan SRC Menunjukkan URL tau direktori tempat file gambar berada WIDTH Lebar gambar (dalam pixel) HEIGHT Tinggi gambar (dalam pixel) ALIGN Posisi teks disekitar gambar (TOP, MIDDLE, BOTTOM, LEFT, RIGHT) ALT Menampilkan teks pengganti gambar jika tidak tampil
  • 20. Form Form adalah sebuah daftar isian, untuk meminta informasi dari user untuk kemudian diolah. Pengolahan dilakukan pada server yang menggunakan skrip yang bersifat server side Tag yang diperlukan untuk membuat form : 1. Tag <form> 2. Tag <TEXTAREA> 3. Tag <SELECT> 4. Tag <INPUT>
  • 21. 1. Tag Form Tag <FORM> yang digunakan untuk mendefenisikan sebuah form. Mempunyai dua atribut yaitu METHODE dan ACTION. Atribut Action METHODE Untuk menentukan metode pengolahan form. Pilihan method adalah GET atau POST ACTION Untuk menentukan URL atau lokasi dari file yang digunakan untuk mengolah form tersebut
  • 22. 2. Tag Textarea Tag <TEXTAREA> digunakan untuk membuat sebuah kotak teks multibaris. Beberapa atributnya : Atribut Action NAME Mendefenisikan nama textarea ROWS Menentukan jumlah baris teks area COLS Menentukan lebar dari textarea
  • 23. 3. Tag Select Tag <SELECT> digunakan untuk membuat sebuah daftar pilihan. Atribut Action NAME Mendefenisikan nama objek select DISABLED Menentukan apa dropdown list tidak diaktifkan SIZE Menentukan berapa pilihan yang akan ditampilkan
  • 24. 3. Tag Input Tag <INPUT> digunakan untuk membuat elemen-elemen untuk meminta informasi dari user, misalnya kotak teks, kotak pilihan, tombol dll Tipe input Atribut Action NAME Mendefenisikan nama dari elemen input, atribut dituliskan kecuali untuk tipe submit dan clear SIZE Menentukan lebar elemen input MAXLENGHT Menentukan maksimum karakter yang dapat dimasukkan kedalam elemen input VALUE Untuk kotak teks, menentukan teks yang tertulis Untuk check box atau radio, menentukan nilai item yang dipilih Untuk submit dan reset, menentukan teks yang tertulis pada tombol TYPE Menentukan tipe input yang dibuat
  • 25. Tipe input : • Text, membuat kotak teks • Password, membuat kotak teks, ditampilkan dengan tanda * • Check box, membuat suatu pilihan, yang dapat dipilih lebih dari satu • Radio, membuat daftar pilihan, yang hanya dapat dipilih satu • Reset, membuat tombol yang fungsinya untuk menghapus semua isian form. • Submit, membuat tombol yang fungsinya mengirim data form untuk diolah.
  • 27.
  • 28. Colspan dan Rowspan Colspan adalah menggabungkan beberapa kolom cell menjadi satu cell Rowspan adalah menggabungkan beberapa baris cell menjadi satu cell
  • 29. sumber Priyanto hidayatullah “pemograman web 2014” html.net php.net Wikipedia dll