-->
Mengenal Tag Html Atau Hypertext Markup Language

Mengenal Tag Html Atau Hypertext Markup Language

belajar komputer

HyperText Markup Language (HTML) yaitu sekumpulan perintah khusus yang biasa disebut tag yang dipakai untuk menciptakan sebuah halaman web di (web browser).


gambar. berguru komputer 1

Bentuk penulisannya menyerupai ini:

<html>
<head>
<title>belajar komputer dasar HTML</html>
</head>
<body>
… isyarat HTML nya disini
</body>
</html>


Contoh isyarat HTML:

<h1>judul</h1> untuk mengatur teks sebagai header 1 atau biasa untuk judul.
<h2>judul</h2> untuk mengatur teks sebagai header 2 atau biasa untuk sub judul.

Contoh penggunaannya:

<h1> berguru komputer dasar HTML </h1><p>
<h2> 1. cara pertama. </h2><br>
<h2> 2. cara kedua. </h2>


Hasilnya di browser Mozilla FireFox:


gambar. berguru komputer 1



<p align=”jenis perataan”> untuk memilih perataan teks pada halaman web.

Contoh:

<p>Paragraph ini yaitu alenia pertama.</p>
<p align=”center”>Paragraph ini yaitu alenia kedua.</p>


Hasilnya:


gambar. berguru komputer 2



<pre> teks halaman </pre> untuk menampilkan teks apa adanya sesuai dengan yang di ketik.

Contoh:

<pre>
Paragraph ini yaitu alenia pertama.
Paragraph ini yaitu alenia kedua.

Paragraph ini yaitu alenia ketiga.

Paragraph ini yaitu alenia keempat.
</pre>

Hasilnya:



gambar. berguru komputer 3



<br> untuk menciptakan pergantian baris baru.
<a href=”alamat-tujuan”>teks untuk di klik</a> untuk menciptakan link tautan ke alamat tujuan dengan mengklik teks untuk di klik.

Contoh:

<br>Baris 1
<br>Baris 2
Baris 3
<br>Baris 4
<a href=”http://hiks-computer.blogspot.com”>ke HIKS Computer BLOG klik disini</a>
<a href=”http://hiks-computer.blogspot.com” target=”_blank”>ke HIKS Computer BLOG</a>

Hasilnya:

gambar. berguru komputer 4



<form> … </form> untuk menciptakan formulir isian. Form yaitu potongan penting dalam web, sebab dengan adanya formulir isian web akan lebih menarik.

<form method=”post” action=” isian-di kirim-kemana.”>
<pre>
Nama: <input type=”text” name=”nama”><br>
Tanggal lahir: <input type=”date” name=”tanggal_lahir”><br>
Alamat: <input type=”text” name=”alamat_1”>
              <input type=”text” name=”alamat_2”>
</pre>
</form>

hasilnya:

gambar. berguru komputer 5




<form method=”post” action=” isian-di kirim-kemana.”>
<pre>

Kota asal:
<select name=”kota_asal”>
<option selected value=”Matang Suri”>Matang Suri</option>
<option value=”Dungun Laut”>Dungun Laut</option>
<option value=”Pangkalan”>Pangkalan</option>
</select>
</pre>
</form>

Hasilnya:

gambar. berguru komputer 6




<form method=”post” action=” isian-di kirim-kemana.”>
<pre>
Berikan komentar:
<textarea name=”komen” rows=”8” cols=”30”>
Komentar disini …
</textarea>
</pre>
</form>

hasilnya:

gambar. berguru komputer 7




<form method=”post” action=” isian-di kirim-kemana”>
<pre>
<input type=”submit” name=”nama_variabel_submit” value=”Kirim Data”>
<input type=”reset” name=”nama_variabel_reset” value=”Hapus Data”>
<input type=”button” name=”nama_variabel_batal” value=”Batalkan”>
</pre>
</form>

hasilnya:

gambar. berguru komputer 8


Semoga bermanfaat.

Baca juga: