Thursday, October 8, 2015

Tag-tag dasar HTML

Tag-tag Dasar HTML

Dari sekian rapihnya sebuah website, ternyata website tersebut menggunakan sintak yang terdiri dari banyaknya tag-tag HTML. Berikut tag-tag dasar HTML yang saya rangkum dari beberapa sumber :


1. Tag membuat judul baru dengan tag <title>... lalu ditutup kembali dengan </title
     Contoh : <title> Tugas Kelas X Multimedia 1 </title>

2. Tag membuat paragraph baru dengan tag <p> Isi Teks </p>
     Contoh : <p> Pada hari itu, saya bermimpi menemuimu di sebuah taman yang asri dan indah.</p>

3. Tag membuat huruf tebal (bold)  dengan tag <b>Isi Teks </b> atau <strong> Isi Teks </strong>
     Contoh : <p>Pada hari itu, <b>saya</b> bermimpi menemuimu di sebuah taman yang asri dan indah</p>

4. Tag membuat huruf bergaris bawah (underline) dengan tag <u> Isi Teks </u>
     Contoh : <p>Pada hari itu, <u>saya</u> bermimpi menemuimu di sebuah taman yang asri dan indah</p>

5. Tag membuat huruf miring (Italic) dengan tag <i>Isi Teks</i>
    Contoh : <p> Pada hari itu, <i>saya<i> bermimpi menemuimu di sebuah taman yang asri dan indah</p>

6. Tag membuat warna background dengan tag <body bgcolor="Warna Bacgroun">
     Contoh : <body bgcolor="red"> atau bisa juga dengan <body bgcolor="#ff0000">

7. Tag membuat warna fareground dengan tag <body text="warna faregroun">
     Contoh : <body text="red"> atau bisa juga dengan <body text="#ff0000">

8. Tag membuat jenis huruf, ukuran, warna font dengan tag <font face="jenis" size="ukuran" color="warna"
    Contoh : <font face="Calibri" size="+3" color="red">

9. Tag membuat perataan teks dengan tag <p align="rata teks"> isi teks </p>
    Contoh : <p align"justify"> Pada hari itu, saya bermimpi menemuimu di sebuah taman </p>

10. Tag membuat garis baru dengan tag <br>
     Contoh : <p>Pada hari itu, saya bermimpi menemuimu di sebuah taman yang asri dan indah <br>
                   Lalu saya memetik bunga mawar ditaman itu, saya dekati dia, <br>
                   Tapi apalah nyatanya, itu hanya sebuah mimpi belaka </p>

11. Tag untuk menyisipkan gambar<image src="file gambar"Width="lebar gambar"height="tinggi gambar">
      Contoh : <image src="kelinci.jpg" width="100" height="150">

12. Tag untuk membuat tabel dengan tag <table> Atribut tabel </table>
  • Atribut antara <table> dengan <.table> yaitu : 
  1. border (membuat ketebalan garis), 
  2. align (mengatur perataan tabel),
  3. width (mengatur lebar tabel)
  4. height (mengatur tinggi tabel)
  5. bg color (mengatur warna latar  belakang tabel)
  • Atribut antara <tr> dengan </tr>
  1. align
  2. bg color
  3. width
  4. height
  • Atribut antara tag  <td> dengan </td>
  1. align
  2. bg color
  3. width
  4. height
    Contoh :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
<body>
<table border="1">
<tr>
<td> Nomer </td>
<td> Nama </td>
<td> Kelas </td>
<td> Sekolah </td>
</tr>
<tr>
<td> 1. </td>
<td> Dedi Junaedi </td>
<td> 10 Multimedia 1 </td>
<td> SMK N 1 LEMAHABANG </td>
</tr>
<tr>
<td> 2. </td>
<td> Anwar Andi Cahyono </td>
<td> 10 Akutansi 1 </td>
<td> SMK N 1 LEMAHABANG </td>
</tr>
</table>
</body>
</html>


maka hasilnya akan seperti ini :

Sekian saja yang dapat saya sampaikan. Semoga bermanfaat :)

Baca juga :  Pengenalan HTML

0 komentar:

Post a Comment