HTML

HTML Dasar: Apa itu – Contoh dan Fungsi + Versi

Apa Itu HTML

HTML adalah bahasa standar untuk membangun sebuah website. Dengan HTML kita dapat membangun sebuah website.

Kepanjangan dari html: Hyper Text Markup Language

Versi HTML Dari Masa Ke Masa

VersiTahun
HTML1991
HTML 2.01995
HTML 3.21997
HTML 4.011999
XHTML2000
HTML52014

Karakteristik

Semua dokumen HTML harus dimulai dengan deklarasi tipe dokumen  <! DOCTYPE html>
Semua dokumen html harus dimulai dengan tag <html> lalu diakhir tag </html>.
Bagian yang ingin di tampilkan harus terdapat di antara <body> sebelum </body>

Contoh 1 : Html – Heading dan Paragaraf

<!DOCTYPE html>
<html>
<head>
<title>Contoh HTML Sederhana</title>
</head>
<body>

<h1>Ini Adalah Heading</h1>
<h2>Ini Adalah Heading</h2>
<h3>Ini Adalah Heading</h3>
<p>Ini adalah Paragraf yang dapat digunakan untuk menulis konten artikel.</p>

</body>
</html>
  • <!DOCTYPE html> menandakan dokumen ini adalah html
  • <html> </html>mulainya html
  • <head> </head> adalah tanda dokumen utama yang berada di atas atau kepala sebuah dokumen html
  • <title> </title> adalah judul
  • <body></body> adalah bagian isi dari dokumen html
  • h1,h2, dan seterusnya digunakan sebagai heading,
  • <p> dan </p> adalah tanda di mulai dan akhirnya sebuah paragraf
  • </p> digunakan sebagai akhir paragraf

Contoh 2 : Html Sederhana Dengan Tabel

<!DOCTYPE html>
<html>
<head>
<title>Contoh HTML Sederhana</title>
</head>
<body>

<h1>Ini contoh html tabel</h1>
<table border="1">
  <tr>
    <th>Nama Lengkap</th>
    <th>Alamat</th>
    <th>Usia</th>
  </tr>
  <tr>
    <td>Anton</td>
    <td>jl. Depati Amir</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Evalia Sentosa</td>
    <td>Bandung</td>
    <td>17</td>
  </tr>
</table>
</body>
</html>

Contoh 3 : Html Link

<!DOCTYPE html>
<html>
<body>

<h2>HTML Links</h2>
<p>Link pada html didifinisikan dengan tag <a> </p>

<a href="https://dosenit.com">Ini adalah contoh link</a>

</body>
</html>

Contoh 4 : HTML Image

<!DOCTYPE html>
<html>
<body>

<h2>HTML Images</h2>
<p>Gambar pada HTML didifinisikan dengan tag img</p>

<img src="https://dosenit.com/wp-content/uploads/2019/03/dosen-ti.png" alt="Dosenit.com" width="270" height="70">

</body>
</html>

Contoh 5 : HTML Button

<!DOCTYPE html>
<html>
<body>

<h2>HTML Button</h2>
<p>Button pada html menggunakan tag button </p>

<button>Click me</button>

</body>
</html>

Contoh 6 : HTML List

<!DOCTYPE html>
<html>
<body>

<h2>HTML List</h2>
<p>Button pada html menggunakan tag ul dan li atau ol dan li </p>

<ul>
  <li>Kopi</li>
  <li>Susu</li>
  <li>Air putih</li>
</ul>

<ol>
  <li>CSS</li>
  <li>PHP</li>
  <li>C++</li>
</ol>

</body>
</html>

Sutiono S.Kom., M.Kom ., M.T.I

Hi, i'm lecturer, technopreneur, investor, businessman, of course an IT Maniac. Have more than 12 years experience in as professional, and 10 years as technopreneur.

Share
Tags: htmlhtml dasar