Tutorial belajar dasar HTML : Mengenal element dalam
HTML
Perlu di ingat sebuah file html atau
document html terdiri dari elemen html di dalam nya. Dan semua susunan element
html akan menjadi sebuah file atau halaman html jika sudah di simpan dengan
ekstensi .html .
Tag html adalah penanda bagi element
dengan penulisan pembuka tag “<” dan penutup tag “>”.
Berikut adalah fungsi-fungsi dari
element atau tag html telah saya rangkum dalam bentuk point-point agar sahabat
S-WEB lebih mudah mengingat dan memahami element.html
- Tag HTML di gunakan sebagai penanda didalam kode html.
- Setiap penulisan tag html di awali dengan < (buka kurung siku) dan di akhiri dengan />(garis miring dan tutup kurung siku) jika penulisan tag html dalam bentuk satu baris.
- Dan tag html di buka dengan < ”nama element”> dan di tutup dengan </”nama element”>.
- Tag pertama di sebut juga dengan tag pembuka dan tag di belakangnya di sebut juga sebagai tag penutup.
- Teks di antara kedua tag tersebut disebut isi elemen
- Tag HTML tidak bersifat case sensitif atau tidak berpengaruh penulisan huruf besar atau huruf kecil nya.
Kita akan membuktikan nya
dengan menulis syntax tag html berikut :
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
<html>
<head>
<title>BELAJAR ELEMENT HTML</title>
</head>
<boody>
<b>Font text tebal</b> <br/>
Text biasa <br/>
<p>Paragraf </p> <br/>
<i>Text miring </i> <br/>
<u>Text dengan garis bawah </u> <br/>
<b><i>Text dengan tulisan tebal dan miring</i></b> <br/>
<u><b><i>Text dengan tulisan tebal,miring dan bergaris bawah</i></b></u> <br/>
</body>
</html>
|
Ini adalah cara penulisan tag element html. Di dini terdapat
3 element html yaitu html,head dan body. Analogi nya seperti seorang manusia
akan sempurna jika memiliki tubuh,kepala,badan dan struktur lain nya.
utorial belajar dasar HTML : Mengenal element dalam HTML
Alangkah baik nya jika
anda langsung mengikuti atau mencoba langsung menulis seperti syntax yang
ada pada gambar di atas. Karena akan lebih cepat teringat dan paham jika
langsung di praktekkan, cara nya ketikkan syntax di atas di editor yg anda
gunakan. Lalu save dengan ekstensi .html dan bisa langsung di jalan kan dengan
membuka file tersebut dengan browser.
Coba sahabat S-WEB simak pada
penulisan syntax tag html di atas.terdapat beberapa tag yang saya masukkan agar
lebih mudah di pahami.
Berikut penjelasannya :
Elemen HTML ini dimulai dengan tag
pembuka <body>, dan berakhir dengan tag penutup </body>.
Fungsi dari tag <body> adalah
untuk mendefiniskkan elemen HTML yang berisi badan (isi) dari dokumen HTML.
Pada tag <title></title>
yang terdapat di dalam tag <head> berfungsi untuk membuat tulisan atau
membuat judul dan menampilkan nya pada tab title browser. Sesuai peraturan
penulisan tag lain nya isi judul nya harus di ketikkan di antara tag tittle
pembuka dan title penutup.
Pada tag <br/> di gunakan
untuk membuat baris baru
Pada tag
<b>,<i>,<u> juga memiliki fungsi tersendiri.tag <b>
untuk membuat font bold, <i> untuk membuat huruf miring. <u> untuk
membuat huruf yang bergaris bawah. Kita juga bisa mengkombinasikan tag-tag
tersebut sesuai keinginan.
Pada tag <a href di gunakan untuk
membuat hyperlink. <a> untuk membuat link dan di tambahkan syntax href=”
link tujuan ”.
- Tag dasar
Berikut adalah daftar tag html dan
fungsi nya :
<html> = Untuk mendefinisikan
sebuah dokumen HTML
<body> = Untuk mendefinisikan
body atau isi sebuah dokumen.
<h1> sampai <h6> = Untuk
mendefinisikan heading 1 sampai 6
<p> = Untuk mendefinisikan
sebuah paragraf
<br> = Untuk membuat baris
baru
<hr> = Untuk memisah antar
bagian atau paragraf ( horizontal rule )
<!– diakhiri dengan –> = Untuk
mendefinisikan komentar dalam source code
- Tag Pemformatan
<b> = Definisi teks yang
ditebalkan
<big> = Definisi teks
yang besar ukurannya
<em> = Definisi teks
yang ditekan
<i> = Definisi teks yang
dicetak miring ( italic )
<small> = Definisi teks
kecil ukurannya
<u> = Definisi teks yang
bergaris bawah
<sub> = Definisi teks yang
jadi subscript
<sup> = Definisi teks
yang jadi supercript
Tag Computer Output
<code>= Definisi teks
computer code
<kbd> = Definisi teks keyboard
<samp> = Definisi contoh
computer code
<tt> = Definisi teks teletype
<var> = Definisi suatu
variabel
<pre> = Definisi teks
preformatted
- Tag Cititation, Quotation, Definition
<abbr> = Definisi suatu
singkatan
<acronym> = Definisi suatu
akronim
<address> = Definisi penulisan
alamat
<bdo> = Definisi arah
penulisan
<blockquote> = Definisi
quotation panjang
<q> = Definisi quotation
pendek
<cite> = Definisi suatu
citation
<dfn> = Definisi istilah
( term
- Tag Link
<a> = Mendefinisikan suatu
link
- Tag Image
<img> = Definisi sebuah image
dalam dokumen
<map> = Definisi sebuah image
map
<area> = Definisi suatu area
dalam image map
- TagInput
<input> = membuat
inputan
- Tag Tombol
<button> = membuat tombol