Kumpulan Tag Dasar HTML

Line Break

Apa itu Line Break, Line Break adalah suatu nama untuk pengkodingan ganti baris di dalam dokumen HTML. Jadi maksudnya ganti baris ini cuma menyajukan informasi pada baris tersendiri tetapi tidak mengganti si paragrafnya. Nah untuk menampilkan suatu teks pada baris baru dalam suatu paragraf, maka kita harus menambahkan suatu tag <br />.

<html>

<head>

<title>Coba Line Break</title>

</head>

<body>

<p>Coba ganti baris<br />Di satu paragraf<br />dengan memakai tag br.</p>
</body>
</html>

Dan inilah penampakan dari coding di atas.Hehe

Heading

Nah apa si heading itu? Heading itu di dalam dokumen HTML ibaratnya suatu judul dari suat topik dalam dokumen HTML. Heading itu sendiri ditampilkan dengan ukuran huruf yang lebih besar dan ditebalkan. Oya bisa juga heading digunakan untuk menunjukkan tingkat keberartian dari teks yang telah kita tulis.

Heading itu sendiri mempunya 6 tingkatan, tingkatannya itu dimulai dari satu sampai 6. Nomor 1 itu menunjukan untuk heading yang terbesar dan nomor 6 untuk heading yang terkecil.

Sintaks elemen dari heading:

<hx>Teks yang menjadi heading</hx>, dimana x adalah nomor heading

<html>

<head>

<title>Contoh Heading</title>

</head>

<body>

<h1>Ini heading</h1>

<h1>Ini heading</h2>

<h1>Ini heading</h3>

<h1>Ini heading</h4>

<h1>Ini heading</h5>

<h1>Ini heading</h6>

</body>

</html>

Dan hasilnya bisa di lihat:

This is heading 1

This is heading 2

This is heading 3

This is heading 4

This is heading 5
This is heading 6

Catatan: Selalu gunakan tag heading ini hanya untuk heading, dan jangan sekali-kali menggunakan tag heading hanya untuk memperbesar suatu tulisan/teks.

Mengatur Letak Heading

Nah ternyata tag heading itu bisa di atur atributnya, misal heading akan di tampilkan di kiri (left), kanan (right), dan tengah (center).

Dan ini dia sintaksnya:

<html>

<head>

<title>Contoh Heading dengan alignment</title>

</head>

<body>

<h1 align=left>Heading di kiri</h1>

<p>Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading </p>

<h1 align=right>Heading di kanan</h1>

<p>Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading </p>

<h1 align=center>Heading di kiri</h1>

<p>Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading </p>

heading left adalah posisi default apabila atribut heading tidak di tuliskan

</body>

</html>

Dan ini dia hasilnya:

Heading di kiri

Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading

Heading di kanan

Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading

Heading di tengah

Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading Ini adalah heading

heading left adalah posisi default apabila atribut heading tidak di tuliskan

Garis Mendatar

Dalam hal ini, dokumen html bisa disisipkan sebuah garis untuk pemisah antarbagian atau paragraf. Kode yang dipakai adalah tag <hr>
Contoh sintaksnya:

<html>
<head>
<title>Line Horizontal</title>
</head>
<body>
<p>Ini adalah paragraf</p>
<hr>
<p>Ini adalah paragraf</p>
<hr>
<p>Ini adalah paragraf</p>
<hr>
</body>
</html>

Hasilnya:

Ini adalah paragraf


Ini adalah paragraf


Ini adalah paragraf


Keterangan:

Garis yang disisipkan dapat dalam bentuk penggaris karena lebarnya dapat di atur, ukuran garis pun bisa dalam bentuk point atau dalam bentuk relatif window browser.

Komentar

Dalam suatu dokumen informasi pasti ada sebagian teks yang diberikan catatan khusus atau disini saya sebut sebagai komentar. Komentar ini di dalam tag html tidak akan ditampilkan melainkan disembunyikan, penulisan tag komentar ditandai dengan tag <!– sebagai tag awal, kemudian di isi teks komentarnya, lalu di akhiri dengan –> tag akhir.

Contoh sintaksnya:

<html>
<head>
<title>Komentar</title>
</head>
<body>
<!– Komentar ini tidak akan tampil –>

<p>Ini adalah paragraf</p>
</body>
</html>

Hasilnya adalah:

Ini adalah paragraf

Tag-tag dasar HTML

Tag Awal Fungsi
<html> Definisi untuk sebuah dokumen HTML
<body> Definisi untuk body dokumen
&lth1>-<h6> Definisi untuk heading (judul) dari 1 s/d 6
<p> Definisi untuk paragraf
<br /> Definisi untuk line break
<hr> Definisi untuk horizontal line
<!–  –> Definisi untuk komentar dalam sintaks

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s