Ringkasan HTML

2

Click here to load reader

description

rangkuman materi html

Transcript of Ringkasan HTML

Page 1: Ringkasan HTML

DASAR-DASAR PEMBUATAN WEB

� Bahasa standard yang digunakan dalam pembuatan web adalah HTML

HTML kependekan dari Hyper Text MarkUp Language.

� Text Editor yang biasa digunakan untuk mengetik kode HTML adalah Notepad

� Browser yang dimiliki windows yang biasa digunakan untuk menampilkan halaman web adalah Internet

Explore

� Penyimpanan file HTML selalu diakhiri dengan .HTML

� Jika kita melakukan perubahan pada kode HTML yang telah disimpan, untuk menampilkan perubahan pada

Internet Explore maka tombol yang harus diklik � Refresh

� Untuk menampilkan kode HTML dari suatu halaman web, langkahnya � View > Source

HTML

� Kode HTML ditandai dengan adanya < dan > yang biasa disebut TAG

� Tag HTML biasanya sepasang, pembuka dan penutup. Tag penutup ditandai dengan /

� Langkah membuka program Notepad ada 2:

o Start > Run > Ketik : Notepad > OK

o Start > Programs > Accessories > Notepad

Berikut ini kode HTML Standar yang harus ada pada halaman web:

<HTML>

<HEAD>

<TITLE> JUDUL PADA TITLE BAR WEB </TITLE>

</HEAD>

<BODY>

ISI WEB DIKETIK DISINI

</BODY>

</HTML>

� Tag < HTML > ditutup dengan tag < / HTML >

� Tag < HEAD > ditutup dengan tag < / HEAD >

� Tag < TITLE > ditutup dengan tag < / TITLE >, tag ini berfungsi untuk menampilkan JUDUL pada title bar web

� Tag < BODY > ditutup dengan tag < / BODY >, tag ini berfungsi untuk menampilkan ISI dari halaman web

Memiliki atribut diantaranya:

� BGCOLOR � u/ memberi warna latarbelakang pada halaman web

� TEXT � u/ memberi warna text pada halaman web

Contoh penggunaan tag < BODY > dengan atribut � < BODY BGCOLOR = “ WHITE” TEXT = “BLACK” >

Beberapa Tag HTML Lain

� Tag Heading ���� berfungsi untuk memformat Heading

Ada 7 buah heading yang dikenal dalam HTML:

� < H1 > Heading 1 < / H1 >

� < H2 > Heading 2 < / H2 >

� < H3 > Heading 3 < / H3 >

� < H6 > Heading 6 < / H6 >

� < H7 > Heading 7 < / H7 > semakin kecil

� Tag Paragraph ���� berfungsi untuk memformat paragraf

� Tag yang digunakan adalah tag < P > kemudian ditutup oleh tag < / P >

� Dengan tag ini kita bisa melakukan perataan teks dengan menggunakan atribut ALIGN

Contoh penggunaan atribut ALIGN

< P ALIGN = “ LEFT “ > � Teks rata kiri dan tutup dengan tag < / P >

< P ALIGN = “ RIGHT “ > � Teks rata kanan dan tutup dengan tag < / P >

< P ALIGN = “ CENTER “ > � Teks rata tengah dan tutup dengan tag < / P >

� Tag lain yang berhubungan dengan paragraph

< BR > � untuk berganti baris

< PRE > � untuk menampilkan sama persis seperti yang diketik pada notepad

� Tag Font ���� untuk mengatur jenis huruf, warna huruf, ukuran huruf

Tag yang digunakan adalah tag < FONT > kemudian ditutup oleh tag < / FONT >

Memiliki atribut diantaranya:

� FACE � u/ mengatur jenis huruf yang digunakan

� COLOR � u/ mengatur warna huruf

� SIZE � u/ mengatur ukuran huruf

Page 2: Ringkasan HTML

Contoh penggunaan tag < FONT > dengan atribut � < FONT FACE = “ COMIC SANS MS” COLOR = “BLACK” SIZE = 5 >

� Tag List (penomoran)

Penomoran ada 2 macam � 1. Penomoran yang berurutan (Ordered List / OL)

2. Penomoran yang tidak berurutan (UnOrdered List / UL)

Penomoran yang berurutan (Ordered List / OL)

� Tag yang digunakan adalah tag < OL > kemudian ditutup oleh tag < / OL >

Memiliki atribut diantaranya: TYPE � u/ mengatur type penomoran yang diinginkan

Contoh penggunaan:

< OL TYPE = “ A” > ���� penomoran yang dihasilkan A, B, C, D, …

< OL TYPE = “ a” > ���� penomoran yang dihasilkan a, b, c, d, …

< OL TYPE = “ i” > ���� penomoran yang dihasilkan i, ii, iii, iv, …

< OL TYPE = “ I” > ���� penomoran yang dihasilkan I, II, III, IV, …

� Setiap item menggunakan tag < Li >

Penomoran yang tidak berurutan/berupa symbol (Unordered List / UL)

� Tag yang digunakan adalah tag < UL > kemudian ditutup oleh tag < / UL >

Memiliki atribut diantaranya: TYPE � u/ mengatur type symbol yang diinginkan

Contoh penggunaan:

< UL TYPE = “CIRCLE” > ���� penomoran yang dihasilkan berupa tanda lingkaran

< UL TYPE = “DISK” > ���� penomoran yang dihasilkan berupa tanda cakram

< UL TYPE = “SQUARE” > ���� penomoran yang dihasilkan berupa tanda kotak

� Setiap item menggunakan tag < Li >

� Tag Table

Untuk membuat tabel, HTML menyediakan tag < TABLE >

Memiliki atribut diantaranya:

� BORDER � u/ mengatur ketebalan garis tepi tabel

� BORDERCOLOR � u/ mengatur warna garis tepi table

� BGCOLOR � u/ mengatur warna background tabel

Contoh penggunaan tag < TABLE > dengan atribut � < TABLE BORDER = 5 BORDERCOLOR = “PINK” BGCOLOR = “ AQUA” >

Bagian dari table:

� Baris dibuat dengan tag < TR > dan ditutup dengan tag < / TR >

� Kolom dibuat dengan tag < TD > dan ditutup dengan tag < / TD >

� Tag MARQUEE ���� berfungsi untuk membuat teks berjalan

Tag yang digunakan adalah tag < MARQUEE > kemudian ditutup oleh tag < / MARQUEE >