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>












Belajar | HTML Element

HTML Element

Ketika anda membuka sebuah halaman web dan anda melihat semua yang ada di hadapan anda, mulai dari sebuah paragraf, banner dan link-link navigasi... itulah elemen-elemen dari sebuah halaman web.
Sebuah elemen terdiri dari tiga buah bagian penting :
  • Tag pembuka
  • Isi
  • Tag penutup

Berikut adalah sebuah elemen paragraf HTML yang lengkap :
<p>isi elemen</p>

Satu halaman sebuah web bisa mengandung ratusan hingga ribuan elemen HTML.

Beberapa contoh elemen-elemen HTML yang lain :
<html></html>
<body></body>
<h1></h1>

Nested HTML


Nested HTML adalah sebuah elemen yang berada di dalam elemen HTML lainnya.
<body><h1>hallo</h1></body>

Dokumen HTML


<html>

<title>Judulku</title>

<body>

<p>Paragrafku</p>

</body>

</html>

Pada contoh di atas terdapat empat elemen HTML

Elemen <p> :
  • <p> merupakan paragraf elemen
  • Elemen ini dibuka dengan <p> dan di tutup dengan </p>
  • Isi dari elemen ini adalah 'Paragrafku'

Elemen <body> :
  • <body> merupakan elemen isi atau badan dari sebuah dokumen HTML
  • Elemen ini dibuka dengan <body> dan di tutup dengan </body>
  • Elemen ini memiliki sebuah nested elemen yaitu elemen <p> beserta isinya

Elemen <title> :
  • <title> merupakan elemen yang mendefinisikan judul dari sebuah dokumen HTML
  • Elemen ini dibuka dengan <title> dan di tutup dengan </title>
  • Isi dari elemen ini adalah 'Judulku'

Elemen <html> :
  • <html> merupakan elemen yang mendefiniskan seluruh bagian dari sebuah dokumen HTML
  • Elemen ini dibuka dengan <html> dan di tutup dengan </html>
  • Elemen ini memiliki tiga nested elemen lainnya, yaitu :<title>,<body> dan <p>


Selalu ingat agar menutup setiap elemen dengan tag penutup

<p>Paragraf 1
<p>Paragraf 2
Contoh di atas mungkin bisa berjalan di banyak browser karena penutup dari elemen dianggap sebagai opsional, tetapi sebaiknya hal ini jangan anda biasakan sebab banyak elemen-elemen HTML yang bisa mengakibatkan error bila tidak terdapat tag penutup di dalamnya.

Case sensitive

HTML tag tidaklah case sensitive, jadi tidak akan bermasalah meskipun anda menuliskannya dengan huruf  besar maupun kecil. <html> -> <HTML>. 

Akan tetapi kami sarankan agar anda menggunakan lowercase / huruf kecil sebab World Wide Web Consorsium (W3C) menyarankan agar menggunakan lowercase untuk setiap elemen HTML 4 dan mengharuskan menggunakannya pada XML









source