Bentuk Umum dan Fungsi Tag HTML dasar ~ Kodeseru

Hyper Text Markup Language (HTML) adalah sebuah bahasa markah yang digunakan untuk membuat sebuah halaman web, menampilkan berbagai informasi di dalam sebuah penjelajah web Internet dan pemformatan hiperteks sederhana yang ditulis dalam berkas format ASCII agar dapat menghasilkan tampilan wujud yang terintegerasi. Dengan kata lain, berkas yang dibuat dalam perangkat lunak pengolah kata dan disimpan dalam format ASCII normal sehingga menjadi halaman web dengan perintah-perintah HTML. Bermula dari sebuah bahasa yang sebelumnya banyak digunakan di dunia penerbitan dan percetakan yang disebut dengan SGML (Standard Generalized Markup Language), HTML adalah sebuah standar yang digunakan secara luas untuk menampilkan halaman web. HTML saat ini merupakan standar Internet yang didefinisikan dan dikendalikan penggunaannya oleh World Wide Web Consortium (W3C). HTML dibuat oleh kolaborasi Caillau TIM dengan Berners-lee Robert ketika mereka bekerja di CERN pada tahun 1989 (CERN adalah lembaga penelitian fisika energi tinggi di Jenewa).[wikipedia], untuk belajar HTML dasar sebaiknya Anda ketikkan di Notepad.

Bentuk umum:

<html>
<head>
<title> judul situs </title>
</head>
<body>
Ini halaman situs Anda.

Letakkan perintah-perintah HTML di sini.
</body>
</html>

Setelah selesai diketikkan, simpan dengan nama contoh.html ingat extensinya .html dan pada note pad pilih All types (*.*). untuk mengeceknya Anda double click file yang telah Anda simpan. Sebenarnya Anda dapat menggunakan ekstensi .htm, tetapi supaya sama, maka sebaiknya digunakan ekstensi .html.

Coba Anda ketikkan perintah-perintah HTML berikut ini, kemudian Anda jalankan di browser !

<html>
<head>
 <title> Latihan Pertamaku </title>
</head>
<body bg color="#000000">
 
 Paragraf ini akan rata kiri 
 br digunakan untuk ganti baris

Kalimat ini akan dicetak Bold 
 Kalimat ini akan dicetak Italic 
 Kalimat ini akan dicetak Bold dan Italic

 <hr width="1000"> 
 Perintah hr digunakan untuk membuat garis

</body>
</html>

Simpan perkerjaan Anda dengan nama contoh_2.html. Jika benar, seharusnya hasilnya ditampilkan seperti gambar berikut ini:

Gambar 1.2 Hasil dari contoh_2.html

Perhatikan perintah berikut ini:

P pada perintah di atas disebut dengan tag, sedangkan align disebut dengan atribut. Atribut merupakan perintah yang menyertai tag.

Berikut beberapa perintah HTML dan fungsinya:

Tag	Atribut/Contoh penulisan	Fungsi
<body>	<body bgcolor=”red”> <body bgcolor=”#FF0000”> text=” ... “ link=” ...” vlink=”...” alink=”...” <body background=”D:\Gambar.jpg”>	Backgorund halaman berwarna merah Memberi warna pada teks Warna link Warna link yang sudah dikunjungi Warna link yang aktif Memberi background gambar pada halaman
<a> ... </a>	<a href=”D:\home.html”>Home</a> <a href="http://www.yahoo.com/">Ya hoo!</a> <a href="mailto:name@domain.com" >here</a> to email me!	Membuat hyperlink/link
<img>	<img src="person.jpg" width="50" height="50" border="0" alt="Person" align="left">	Memasukkan gambar dengan nama file gambar person.jpg, lebar 50px, tinggi 50px, border 0, rata kiri, dan jika gambar tidak muncul akan keluar teks Person
	<img src=”C:\Documents and Settings\All Users\Documents\My Pictures\Sample Pictures\Sunset.jpg>
<font>... /font>	<FONT size="2" color="#FFFF00" face="arial">...</font>	Mengatur font dengan ukuran 2, warna kuning, jenis huruf Arial
<BIG>...</BIG>	<BIG>Contoh </BIG>	Membuat teks Contoh menjadi lebih besar
<SMALL>...</SMALL>	<SMALL> Contoh</SMALL>	Membuat teks Contoh menjadi lebih kecil
<b>...</b>	Teks bold/dicetak lebih tebal
<i>…</i>	Teks italic/miring
<strike>...</strike>	Teks tercoret
<u>...</u>	Teks underlined
<h1>...</h1>	Teks heading 1. Tingkat heading bisa sampai tingkat 6. Semakin besar tingkar heading, maka teks aka dicetak semakin kecil
<hr>	<hr width=”600”> <hr align=”center” size=”5” width=”80%”	Garis dengan lebar 600. Tag <hr> tidak perlu ditutup Garis dengan tinggi 5, lebar 80% dari lebar layar browser dan rata tengah
<p align=”center’> ... </p>	Paragraf rata tengah. Perintah ini juga dapat ditulis dengan tag <center>...</center>
<br>	Tag untuk ganti baris	Tag <br> tidak perlu ditutup
<sup>...</sup>	Teks superscript
<sub>...</sub>	Teks subscript
<marquee> .... </marquee>	Teks berjalan. Memiliki atribut direction, behavior dan lain-lain. Contoh: <marquee direction=”right”> ....</marquee> <marquee behavior=”alternate”> ... </marquee>

TABLE

Beberapa perintah penting untuk membuat tabel:
1. <table border=”1”> .... </table> merupakan perintah utama dalam pembuatan tabel, tabel dengan ketebalan 1px
2. <tr> ... </tr> tag untuk membuat baris
3. <td> ... </td> tag untuk membuat kolom/cell
4. colspan merge/melebarkan kolom/cell
5. rowspan merge/melebarkan baris

Atribut tabel dan fungsinya

Tag	Atribut/Contoh penulisan	Fungsi
<table> ... </table>	border=”...”	Ketebalan tabel. Contoh: <table border=”1”>
	align=”...”	Pengaturan tabel (rata tengah, kanan atau kiri)
	width=”...”	Lebar tabel. Bisa diisi dengan satuan pixel atau persen. Contoh: <table width=”80%”> atau <table width=”600”>
	valign=”...”	Perataan secara vertikal dari suatu cell. (top, middle, bottom)
	bordercolor=”...”	Warna border
	bgcolor=”...”	Warna background tabel, baris atau cell

Agar cell dalam tabell kosong, maka dapat digunakan perintah  

demikian penjelasan Bentuk Umum dan Fungsi Tag HTML dasar, mohon maaf apabila ada kesalahan, mudah-mudah bermanfaat, sekian dan terimakasih.

Kodeseru

Bentuk Umum dan Fungsi Tag HTML dasar

Related Post