Langsung ke konten utama

Syntax Dasar HTML [ Bagian I ]

Assalamu'alaikum wr. wb.


Pada struktur yang saya jelaskan di postingan sebelumnya, disini saya jelaskan lagi lebih rinci mengenai struktur html tersebut. Saya akan menjelaskan mengenai Tag,Element, dan Attribute.


Tag merupakan huruf/teks yang berada diantara tanda kurung siku < dan >. fungsi dari tag sendiri untuk memberitahukan kepada browsher untuk apa tag itu ditulis. Hampir semua tag slalu ditulis berpasangan, yaitu tag pembuka dan tag penutup.

Contoh
<body> content </body>
Pada contoh tersebut tag yang digunakan adalah tag body.

Elemen terdiri dari tiga bagian yaitu tag pembuka, isi, dan tag penutup. Tag ditulis secara berpasangan tidak boleh saling tumpang tindih dengan tag-tag lainnya.

Contoh

Salah satu contoh kesalahan dalam penulisan tag.
<p>
<em> contoh </p>
</em>
Kita harus menyusunnya secara berpasangan, contoh :
<p>
<em> content </em>
</p>

Attribut digunakan untuk menambahkan informasi di dalam tag, informasi yang dimaksud seperti memberikan warna pada teks, posisi teks, ukuran teks, dan lain sebagainya. secara umum Attribut memiliki pasangan berupa nama dan nilai, dan nilai pada attribut harus berada dalam tanda petik satu (') atau tanda petik dua (").

Contoh
<font color="red"> content </font>

Itulah 3 penjelasan penting dari Struktur HTML, gampang bukan? untuk pembahasan selajutnya. Kita akan mencoba membuat tampilan web sederhana.

Jika kita ingin membuat sebuah halaman web maka kita harus menggunakan semuanya (tag,element,attribute). Untuk saya akan membuat sintak sederhana untuk memnggabungkan semuanya. Silahkan copy dan paste pada teks editor anda seperti notepad atau sebagainya, simpan dalam format .html. Anda bisa melihat hasilnya jika anda buka dengan browsher anda.

<!DOCTYPE html>
<html>
<head>
<title> Setetes Ilmu Komputer </title>
</head>
<body>
<h2> Belajar HTML <font color="blue"> gampang kok </h2></font>
    <p><h3> Aku adalah Paragraf </h3></p>
    <i> Aku italic </i>
</body>
</html>

Anda juga bisa belajar dasar html di websitenya w3school(dot)com.  Mungkin itu saja pada postingan ini, semoga anda mendapatkan setetes ilmu pada postingan ini, silahkan anda latihan pada pc masing2, dengan sering latihan anda akan lebih baik.

wassalam.

Komentar