Search

Sekilas Tentang HTML

Diposting oleh Hadi Permana on Sabtu, 25 Januari 2014

Sekilas Tentang HTML
HTML adalah singkatan dari hypertext markup language. Fungsi HTML di dalam sebuah dokumen web adalah untk mengatur struktur tampilan dokumen tersebut dan juga untuk menampilkan link atau smabungan ke halaman web lain yang ada di internet. Bisanya sebuah dokumen html disimpan dalam extesi .html. HTML disebut dengan markup language karena HTML befungsi untuk memprindah file tulisan (text) biasa untuk dapat dilihat pada sebuah web browser.
Untuk membuat HTMl, anda cukup menggunakan notepad, walaupun sebenarnya banyak sekali seoftware-software yang memudahkan kita dalam membuat dokumen HTML ini.

Sintak Dasar HTML
Berikut ini adalah struktur HTML.
Tulislah contoh berikut menggunakan notepad kemudian simpanlah dalam format .html.
<html>
<head>
<title>Ini HTML</title>
</head>
<body>
Ini adalah dokumen HTML pertamaku
</body
</html>

Skrip di atas adlah file HTML yang paling sederhana. Setiap tag HTML selalu memiliki tag pembuka dan tag penutup. Pada contoh diatas, misalnya tag <head> maka penutupnya </head>. Coba perhatikan, ada tanda ”/” pada setiap tag penutup.

Manipulasi Text
Gunakan notepad untuk menuliskan sntaks berikut ini dan simpan dengan ektensi .html.
<html>
<head>
<title>Manipulasi text</title>
</head>
<body>
<b>huruf tebal atau bold</b? <br>
<i>huruf miring atau italic</i> <br>
<u>garis bawah atau underline</u> <br>
<font color=”green”>ini warna hijau</font> <br>
<font color=”blue”>ini warna biru</font> <br>
<font color=”brown”>ini warna coklat</font> <br>
</body>
</html>
Untuk kode warna biasanya menggunakan beberapa kode tertentu dengan huruf atau angka atau gabungan keduanya.berikut ini standar koe warna dan jenis warna yang dihasilkan.

Warna
Hex 6
RGB
Gray
#808080
128,128,128
White
#FFFFFF
255,255,255
Maroon
#FF0000
128,0,0
Red
#FF0000
255,0,0
Purple
#800080
0,128,0
Fuchsia
#FF00FF
255,0,255
Green
#008800
0,128,0
Lime
#00FF00
0,255,0
Olive
#808000
128,128,0
Yellow
#FFFF00
255,255,0
Navy
#000080
0,0,128
Blue
#0000FF
0,0,255
Teal
#008080
0,128,255
Aqua
#00FFFF
0,255,255
Black
#000000
0,0,0
Silver
#C0C0C0
192,192,192

Ada beberapaaturan lain yang sigunakan untuk teks. Berikut contoh beberapa aturan tersebut.
<html>
<head
<title>Manipulasi Text</title>
<body
<b>huruf tebal atau bold</b? <br>
<i>huruf miring atau italic</i> <br>
<u>garis bawah atau underline</u> <br>
<font size=”1”>ini huruf dengan ukuran 1</font> <br>
<font size=”3”>ini huruf dengan ukuran 3</font> <br>
<font size=”5”>ini huruf dengan ukuran 5</font> <br>
</body>
</html>

Pengaturan Paragraf
Untuk mengatur sebuah paragraf, gunakan sintax berikut
Html>
<head>
<title>mengatur sebuah paragraf</title>
</head>
<body
<p align=”left”>tulisan ini posisinya rata kiri</p>
<p align=”right”>tulisan ini posisinya rata kanan</p>
<p align=”justify”>tulisan ini posisinya rata kiri dan kanan</p>
</body>
</html>

Hyperlink
Hyperlink atau lik adalah sambungan yang akan menghubungkan suatu web dengan web lainnya di Internet. Sebagai contoh, kita akan membuat link yang akan menuju ke halaman utama Google maka perhatikan contoh dibawah ini.
<html>
<head>
<title>membuat hyperlink</title>
</head>
<body>
Kliklah tulisan ini untuk pergi ke google <a href=http://google.co.id/>Halaman utama Google</a>. Terima kasih.
</body>
</html>

Images
Untuk memunculkan gambar pada halaman web, kita hanya tinggal menambahkan sintaks HTML berikut.
<img src=”target_atau_url_gambar”>
Contoh:
<html>
<head>
<title>gambar</title>
</head>
<body>
<img src=”angel_evil.jpg”>
</body>
</html>

Pada contoh diatas, pastikan bahwa gambar berada pada folder yang sama dengan file HTML yang telah dibuat. Jika anda menyimpan gambar itu pada sebuah folder, misalnya nama folde itu adalah “images”, maka kode di atas akan menjadi:
<html>
<head>
<title>gambar</title>
</head>
<body>
<img src=”angel_evil.jpg”>
</body>

</html>

Related Post:

{ 0 komentar... read them below or add one }

Posting Komentar

Diberdayakan oleh Blogger.