Belajar | HTML Attribut

HTML Attribute

  • Elemen HTML bisa memiliki atribut di dalamnya.
  • Atribut memberikan informasi tambahan terhadap sebuah elemen.
  • Atribut selalu ditempatkan di tag pembuka sebuah elemen.
  • Atribut berisi nama dan nilai di dalamnya mis: color="red".

Contoh Attribute


Ok, tanpa basa-basi lebih jauh lagi kita lihat contoh berikut :
Paragraf 1
Paragraf 2
Paragraf 3
Seperti anda lihat, teks paragraf di atas memiliki posisi yang berbeda-beda, hal itu terjadi karena penambahan attribut ke dalam tag <p>

Contoh :

 <p align="right">Paragraf 1</p>
<p align="center">Paragraf 2</p>
<p align="left">Paragraf 3</p>






Selalu isikan nilai atribut dengan tanda petik


Nilai dari atribut harus selalu di isikan dengan tanda petik, mis align="center".

Memakai tanda satu petik ' maupun tanda dua petik " tidaklah bermasalah.
 
 
 
 
 
 
 
 
 

Belajar | HTML List

Anak Pak Raden :
  • Budi
  • Wati
  • Joni
Urutan anak Pak Raden :
  1. Budi
  2. Wati
  3. Joni

Dengan HTML <ul> "unordered list" dan <ol> "ordered list" anda bisa membuat daftar seperti di atas.

Berikut adalah kode dari tampilan di atas :
 
 
<p>Anak Pak Raden :</p>
<ul>
<li>Budi</li>
<li>Wati</li>
<li>Joni</li>
</ul>

<p>Urutan anak Pak Raden :</p>
<ol>
<li>Budi</li>
<li>Wati</li>
<li>Joni</li>
</ol>
 
 
 
 
 
 
 
 
 
source 

Belajar | HTML Format

HTML memiliki banyak tag-tag lain yang berfungsi untuk mengubah sebuah tulisan.
Tulisan ini bold 

Tulisan ini italic

Tulisan ini strike

Tulisan ini strong

Tulisan ini emphasized

Tulisan ini code/computer

Tulisan ini subscript dan superscript

source code contoh di atas :

<p><b>Tulisan ini bold</b></p>

<p><i>Tulisan ini italic</i></p>

<p><strike>Tulisan ini strike</strike></p>

<p><strong>Tulisan ini strong</strong></p>

<p><em>Tulisan ini emphasized</em></p>

<p><code>Tulisan ini code/computer</code></p>

<p>Tulisan ini <sub>subscript</sub> dan <sup>superscript</sup></p>  










source

Belajar | HTML Paragraf

Tag <p> mendefinisikan sebuah paragraf.
Dengan menggunakan tag ini, maka browser secara otomatis akan memasukkan garis/space kosong di bagian atas dan bawah paragraf.

Contoh : <p>Paragraf pertamaku</p> 









source 

Belajar | HTML Komentar

Sebelum kita melangkah lebih jauh kami akan mengenalkan kepada anda mengenai konsep dari HTML komentar/comment.

Meskipun 'komentar' sifatnya adalah opsional namun ada kalanya pemberian 'komentar' akan sangat membantu anda.

Komentar adalah bagian dari kode HTML, tujuannya adalah untuk menjelaskan bagian-bagian dari kode.
Contoh syntax dari sebuah komentar HTML :

<!-- isi dari komentar HTML -->
 
Komentar HTML selalu dimulai dengan <!> dan diakhiri dengan >> , hal ini memberitahukan kepada browser darimana sebuah komentar dimulai dan diakhiri.
C









source

Belajar | HTML Title

Elemen <Title> digunakan untuk menyatakan judul sebuah halaman web. Posisinya berada di dalam elemen <head>.
<html>

<head>

<title>Judul Halaman websiteku</title>

</head>

<body>

Isi dari halaman websiteku

</body>

</html>
Tulisan di dalam <title> tidak akan terlihat di browser, tapi beberapa browser menampilkannya di bagian atas window dari browser.

Belajar | HTML Heading

Heading adalah bagian penting dari HTML

Elemen-elemen h1,h2,h3,h4,h5,h6 adalah elemen headings ( h = heading ).
Dimana h1 adalah adalah tingkat pertama dan teks dari h1 adalah yg terbesar diikuti oleh h2 hingga h6 yang merupakan elemen headings yang terakhir.

Heading 1


Heading 2


Heading 3


Heading 4


Heading 5

Heading 6
Browser secara otomatis menambahkan satu bagian kosong/empty space pada setiap heading.

Kode dari tampilan headings di atas :
Codingku HTML Editori
<html>

<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>

</html>