Dasar dasar HTML
1. Membuat judul tab dalam halaman web, buka notepad++ terlebih
dahulu, kemudian ketikan code dibawah ini:
<html>
<head>
<title> My First HTML Project </title>
</head>
<bodyBGCOLOR=“Green”
TEXT=“Red”>
WELCOME TO MY WEBSITE
</body>
<body
bgcolor=”#00ff00”>
</html>
Langkah selanjutnya simpan dalam format HTML dan buka file
dengan firefox atau sejenisnya, maka hasilnya akan seperti pada gambar 1
berikut:
2. Mengatur paragraf texs, buka notepad++ kemudin ketikan code
dibawah ini:
<html>
<head>
<title>
Tag P, Br dan Hr </title>
</head>
<body>
<p>Ini
adalah paragraf pertama, yang berisi 3 baris. Baris satu, dua dan tiga.
<br><br></p>
<p>Ini
adalah paragraf kerdua, yang berisi garis horizontal</p>
<hr> Ini
adalah garis horizontal.
</body>
<body
bgcolor=”#00ff00”>
</html>
Langkah selanjutnya simpan dalam format HTML dan buka file
dengan firefox atau sejenisnya, maka hasilnya akan seperti pada gambar 2
berikut:
3. Mengatur ukuran huruf, buka notepad++, kemudian
ketikan code dibawah ini:
<html>
<head>
<title>
Tag Heading </title>
</head>
<body>
<h1>
Heading 1 </h1>
<h2>
Heading 2 </h2>
<h3>
Heading 3 </h3>
<h4>
Heading 4 </h4>
<h5>
Heading 5 </h5>
<h6>
Heading 6 </h6>
</body>
<body
bgcolor=”#00ff00”>
</html>
Langkah selanjutnya simpan dalam format HTML dan buka file
dengan firefox atau sejenisnya, maka hasilnya akan seperti pada gambar 3
berikut:
4. Mengatur format texs, Buka notepad++, kemudian ketikan code
dibawah ini:
<html>
<head>
<title>format
tulisan</titele>
</head>
<body>
teks
normal <br>
<small>
teks small </small><br>
<big>
teks big</big><br>
<b>
teks tebal </b><br>
<i>
teks miring </i><br>
<u>
teks bergaris bawah </u><br>
Contoh
superscript : x <sup>2</sup><br>
Contoh
subscript : H<sub>2</sub>O<br>
<strike>
Ini teks tercoret </strike><br>
<font
size = 5 face = verdana>
menggunakan
tag font
</font>
</body>
<body
BGCOLOR ="#00FF00">
</html>
Langkah selanjutnya simpan dalam format HTML dan buka file
dengan firefox atau sejenisnya, maka hasilnya akan seperti pada gambar 4
berikut:
5. Membuat from komentar, buka notepad++, kemudian ketikan code
dibawah ini:
<html>
<head>
<title> From komentar </title>
</head>
<body>
<table>
<tr>
<tdcolspan="3"> </td></tr><tr>
<td colspan="3"><h3>Silahkan Berkomentar : </h3></td>
<td colspan="3"><h3>Silahkan Berkomentar : </h3></td>
</tr>
<tr>
<td>Nama</td>
<td>:</td>
<td><input
type=text name="nama"></td>
</tr>
<tr>
<td>Email</td>
<td>:</td>
<td><input
type=text name="email"></td>
</tr>
<tr>
<td
valign=top>Komentar</td>
<td
valign=top>:</td>
<td><textarea
name="komentar" rows=6 width=200></textarea></td>
</tr>
<tr>
<td
colspan="3"><input type=submit name="submit"
value=submit></td>
</tr>
</table>
</table>
</body>
<body
BGCOLOR ="#00FF00">
</html>
Langkah
selanjutnya simpan dalam format HTML dan buka file dengan firefox atau
sejenisnya, maka hasilnya akan seperti pada gambar 5 berikut:
6. Mengatur kolom, buka notepad++ kemudian ketikan code dibawah
ini:
<html>
<head>
<title>warna-warna</title>
</head>
<body>
<table width="300" border="1">
<tr>
<td colspan="3"
align="center">warna-warna </td>
</tr>
<tr>
<td
bgcolor="#00FF00">Hijau</td>
<td
bgcolor="#FFFF00">Kuning</td>
<td
bgcolor="#FF0000">Merah </td>
</tr>
<tr>
<td
bgcolor="#999999">Abu-abu</td>
<td
bgcolor="#0000FF">Biru</td>
<td
bgcolor="#FF9900">Orange</td>
</tr>
<tr>
<td
bgcolor="#663300">Cokelat</td>
<td
bgcolor="#3399CC">Biru muda</td>
<td
bgcolor="#FF00FF">Merah muda</td>
</tr>
</table>
</body>
<body BGCOLOR ="#00FF00">
</html>
Langkah
selanjutnya simpan dalam format HTML dan buka file dengan firefox atau
sejenisnya, maka hasilnya akan seperti pada gambar 6 berikut:
This is dummy text. It is not meant to be read. Accordingly, it is difficult to figure out when to end it. But then, this is dummy text. It is not meant to be read. Period.
ConversionConversion EmoticonEmoticon