Sabtu, 22 Agustus 2020

Belajar HTML Dasar

 


Pengertian HTML

HTML(Hyper Text Markup Language) adalah simbol-simbol atau tag-tag yang dituliskan dalam sebuah file yang dimaksudkan untuk menampilkan halaman pada web browser. Tag-tag HTML selalu diawali dengan <x> dan diakhiri dengan </x> dimana x tag HTML seperti b, i, u dan sebagainya. Namun ada juga tag yang tidak diakhiri dengan tanda </x> seperti tag <br>, <input> dan lainnya.

File-file HTML selalu berakhiran dengan ekstensi *.html. Jadi jika mengetik sebuah naskah dan menyimpannya dengan ekstensi *.html maka jadilah file yang berformat HTML.

Untuk mempelajari HTML, yang dibutuhkan adalah:

  1. Text Editor : notepad++, sublime, dll
  2. Browser : Firefox, Chrome, dll

Menggunakan Tag pada HTML

Contoh menggunakan tag pada HTML

<b>Ini tulisan tebal</b> hasilnya Ini tulisan tebal

<i>Ini tulisan miring</i> hasilnya Ini tulisan miring

<u>Ini tulisan bergaris bawah</u> hasilnya Ini tulisan bergaris bawah

Ada beberapa tag yang memilki atribut didalamnya, seperti tag <font>, <table>, <input> dan sebagainya. Pada tag font ia memiliki beberapa atribut diantaranya atribut: color, size, face. Untuk lebih memahami atribut lihatlah contoh berikut ini. 

<font color=”red” face=”Arial” size=”12”>Ini Font Arial berwarna merah dan berukuran 12 pt</font> hasilnya Ini Font Arial berwarna merah dan berukuran 12 pt

Catatan:

  • Atribut color digunakan untuk menentukan warna tulisan.
  • Atribut face digunakan untuk menentukan jenis huruf.
  • Atribut size digunakan untuk menentukan ukuran huruf.

Ada ratusan tag pada HTML dan tidak perlu menghafal semua. nanti malah kepala bisa pecah. Cukup hafalkan yang penting-penting saja seperti <table><form><input><ul>. Tidak hafal pun tidak apa-apa karena bisa melihat daftar kalau lupa, yang penting kita paham. Ingat bukan menghafal tapi memahami!

Menggunakan Atribut dari Tag

Sebelum memulai, mari kita buat folder di drive D:\ yang bernama HTML.
Saat ini materi yang dipelajari antara lain:
  • Menggunakan berbagai attribut dari tag diantaranya:
  • Tag p, font, table, form, input, select, option, a, body, img, ul, ol, li dan attribut universal
Langsung saja
1. Buka text editor yang sudah terinstal (notepad++ atau yang lain)
2. Ketik kode dibawah ini

<html>
<head>
<title>Atribut Tag <P></title>
</head>
<body>
<p align="left"><b>Teks ini berada di kiri</p>
<p align="center">Teks ini berada di tengah</p>
<p align="right">Teks ini berada di kanan</b></p>
<p align="justify">Paragraph ini bertipe justify. Dimana semua teks akan dibuat
lurus sama dengan batas tepi halaman. Maka dari itu bentuk atribut pada paragraf harus dipahami.</p>
</body>
</html>


3. Simpan file tersebut dengan mengklik menu File – Save. Akan muncul kotak dialog Save, arahkan ke drive D:\ lalu HTML kemudian pada isian File Name isikan tag_p.html dan pastikan Save as Type adalah HTML Document.

4. Untuk melihat hasilnya, buka file tersebut dengan cara klik kanan pada file tersebut pilih open with chrome atau firefox.


Demikian tutorial belajar HTML dasar.

Tidak ada komentar:

Posting Komentar

Langganan: Posting Komentar (Atom)