PERTEMUAN 2 HTML (Lanjutan).

Slides:



Advertisements
Presentasi serupa
Matakuliah Pengenalan Internet
Advertisements

Image – Hyperlink – Form
Mengelola isi halaman web
Hyper Text Markup Language
SESION 3 : Memformat Dokumen html (lanjutan)
Membuat form HTML+PHP Dwi Cahyono.
Pengembangan Web Pertemuan 2 HTML Basic (Text Formating, Link & Frame)
STMIK PPKIA Pradnya Paramita
DASAR HTML Marina Azizah. Struktur Dokumen HTML Dokumen HTML bisa di bagi mejadi tiga bagian utama: HTML Setiap dokumen HTML harus di awali dan di tutup.
PEMROGRAMAN WEB HTML LANJUT BY : ABD.WAHID YUNUS TI UIN ALAUDDIN MAKASSAR.
Reza Sulistyawan, S.Kom Pemrograman Web 1 1 Frame Frame memungkinkan satu halaman Web atau lebih ditampilkan pada sebuah jendela browser Halaman yang berbasis.
Apa itu HTML ? Perangkat lunak yang digunakan untuk membuat atau mengetikkan kode file HTML Perangkat lunak yang digunakan untuk menjalankan atau menampilkan.
Pengembangan Evangs Mailoa Enumerasi, Image & Table WEB.
Form dan Input HTML.
3. Pendalaman HTML Penggunaan format table di HTML
HTML – 4 FORM. FORM adalah elemen HTML yang digunakan untuk mengizinkan pengguna web mengirimkan data ke Web Server. Dengan kata lain form berperan sebagai.
Pengantar Pemrograman WEB
HTML (Table, Form, Frame, Hyperlink)
 Tabel sangat penting artinya dalam desain web. Karena dengan menggunakan tag table Anda dapat membuat halaman web "terbagi" pada beberapa kolom atau.
Enumerasi, Images & Table
TABEL , FORM DAN FRAME.
Atribut dalam Body Atribut dan contoh penulisan Fungsi
FORM dan FRAME.
ADD-ON Dasar HTML.
Menggunakan Formulir A’ud Solehuddin::Jan2012. Materi Dasar Penggunaan Formulir Memasukkan Data dengan INPUT Tipe TEXT Tombol SUBMIT dan RESET Perbedaan.
Perancangan Web Pertemuan IV
Fakultas Teknologi Informasi Universitas Budi Luhur
FORM.
Pemrograman Basis Data Berbasis Web
Internet dan Web By : Lisda Juliana P..
FORM.
Tim FT Elektro UHAMKA HTML (Bagian 2)
Tabel HTML Bambang Irawan.
Mengelola isi halaman web
Modul 8 STMIK IKMI CIREBON Oleh Dita rizki amalia.
Mengenal dan teknik pembuatan form
MATERI PERKULIAHAN REKAYASA PERANGKAT LUNAK DISUSUN OLEH : KRISTIAWAN NUGROHO, M.KOM Fakultas Kesehatan.
Pemrograman Web List, link, & Tag img
FORM HTML Oleh : Fajar Y. Zebua.
Lutfi Budi Ilmawan Univ. Muslim Indonesia
STMIK PPKIA Pradnya Paramita Pemrograman berbasis Web
RONA SALWA IHDINA PTI UM
Perancangan & Pemrograman Web
HTML PEMROGRAMAN INTERNET.
HTML.
HTML HYPERTEXT MARKUP LANGUAGE
Mengenal dan Teknik Pembuatan Frame
PHP : Hypertext Processor
Mengenal dan Teknik Pembuatan Frame
PJ : Nuraini Purwandari
( HyperText Markup Language)
List, Image, Link dan tabel
Hyperlink & Form Pertemuan 11
Pemrograman Berorientasi Platform (IN315B)
Pemrograman Web HTML (4) Table Form Andy Haryoko, ST
Hyperlink and Form Session 10 & 11
Mengelola isi halaman web
Pertemuan 2 HTML Basic (Text Formating, Link & Frame)
Pemrograman Web HTML (5) Form CSS Andy Haryoko, ST
KOMPUTER APLIKASI IT I FORM.
Pemrograman Berorientasi Platform (IN315B)
Komputer aplikasi it-I (html)
Darmawan satyananda Mathematics department State university of malang
FRAME Pada HTML STMIK – AMIK Jayanusa. A. Frameset dan Frame Frameset adalah sebuah tag untuk pendefenisan pembuatan frame ( ) Frame adalah teknik yang.
FORM HTML.
Enumerasi, Images & Table
STMIK PPKIA Pradnya Paramita Pemrograman berbasis Web
Enumerasi, Images & Table
Pertemuan 2 HTML Basic (Text Formating, Link & Frame)
Pertemuan 2 HTML Basic (Text Formating, Link & Frame)
Transcript presentasi:

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. Sumber : http://html.net

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 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 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 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