Listing Pada HTML

Unordered List

Fungsi dari tag ini adalah untuk membuat list yang tidak beraturan atau berurutan.

Contoh :

Daftar Makanan
<ul type='circle'>
<li>Nasi Goreng</li>
<li>Ayam Bakar</li>
<li>Ikan Bakar</li>
</ul>

Hasilnya :

Daftar Makanan

• Nasi Goreng
• AyamBakar
• Ikan Bakar

Penjelasan :

<ul> adalah tag induk utama dari Unordered List

<li> adalah tag untuk daftar dari list tersebut

type dari UL ini sendiri adalah circle,disk, dan square.

Ordered List

Fungsi dari tag ini adalah untuk membuat list yang teratur atau berurutan

Contoh :

Daftar Persyaratan
<ol type='1'>
<li>FC Akte</li>
<li>FC Kartu Keluarga</li>
<li>Pas Foto 3 x 4 Berwarna</li>
</ol>

Hasilnya :

Daftar Persyaratan

1. FC Akte
2. FC Kartu Keluarga
3. Pas Foto 3 x 4 Berwarna

Penjelasan :

type dari OL adalah 1,A,a,I,i

Read More

Paragraf dan Kalimat Pada HTML

Untuk membuat sebuah paragraph pada sebuah document HTML anda hanya perlu menuliskan kode :

<p>Paragraf</p>

Contoh :

<p>
Hay, kawan semua <br>
Ini adalah paragraf pertama saya
</p>
<p>
Hay, kawan semua <br>
Ini adalah paragraf kedua saya
</p>

*Penjelasan :

<br>  adalah kode yang digunakan untuk pindah baris.

Jika kawan semua tidak mau ribet dengan penggunaan kode <br> , maka anda bisa menggunakan kode <pre> , berikut contohnya :

<p>
<pre>
Hay, kawan semua
Ini adalah paragraf pertama saya
<pre>
</p>
<p>
<pre>
Hay, kawan semua
Ini adalah paragraf pertama saya
<pre>
</p>

Untuk mengatur posisi paragraph anda bisa menggunakan atribut “align”. Untuk yang belum tau apa itu atribut, saya akan jelaskan bahwa atribut adalah semacam kode tambahan didalam sebuah tag HTML yang berfungsi untuk mengatur atau memberikan property pada sebuah tag HTML. Berikut contohnya :

<p align=’center’>
Hay, kawan semua <br>
Ini adalah paragraf tengah
</p>
<p align='left'>
Hay, kawan semua <br>
Ini adalah paragraf kiri
</p>
<p align='right'>
Hay, kawan semua <br>
Ini adalah paragraf kanan
</p>
<p align=’justify’>
Hay, kawan semua <br>
Ini adalah paragraf rata kanan kiri
</p>

Baik, sekian tutorial kali ini. Terima kasih dan sampai jumpa lagi di tutorial yang berikutnya.

Read More

Formating text pada HTML

Untuk kawan – kawan yang sering menggunakan Microsoft Word mungkin tidak asing dengan istilah Bold, Italic dan lain sebagainya. Nah, kali ini kita akan belajar semua istilah tersebut namun tidak pada Microsoft Word melainkan pada HTML, yuk mari kita lihat.

1. Bold

untuk membuat bold pada html digunakan tag <b>, berikut contohnya :

<b>Ini adalah tulisan tebal</b>

hasilnya :

Ini adalah tulisan tebal



2. Italic

untuk membuat italic pada html digunakan tag <i>, berikut contohnya :

<i>Ini adalah tulisan miring</i>

hasilnya :

Ini adalah tulisan miring


3. Underline

untuk membuat underline pada html digunakan tag <u>, berikut contohnya :

<u>Ini adalah tulisan yang digaris bawahi</u>

hasilnya :

Ini adalah tulisan yang digaris bawahi


4. Subscript

untuk membuat subscript (tulisan dibawah) pada html digunakan tag <sub>, berikut contohnya :

H<sub>2</sub>O

hasilnya :

H₂O


5. Superscript

untuk membuat superscript pada html digunakan tag <sup>, berikut contohnya :

X<sup>2</sup>

hasilnya :

X²

6. Kombinasi

Contoh :

<b><u>Ini adalah teks yang penting</u></b>

hasil :

Ini adalah teks yang penting

<i>O<sub>2</sub></i>

hasil :

O₂


Baik, tadi itu adalah cara bagaimana memformat tulisan pada HTML. Sekian tutorial kali ini sampai jumpa lagi pada artikel berikutnya ya. Terima kasih.

Read More

Memulai HTML

Hallo semua, kali ini saya akan membuat tutorial tentang memulai belajar HTML. Hanya untuk sekilas info, bahwa HTML yang merupakan kepanjangan dari “Hyper Text Markup Language” ini adalah bahasa pemrogramman yang paling dasar untuk membuat sebuah halaman web. Jadi, jika teman – teman semua ingin belajar membuat website maka bahasa pemrogramman inilah yang wajib untuk kalian semua pelajari. Baik, mari kita langsung saja mulai tutorialnya.

Untuk alat dan bahannya anda hanya perlu Notepad dan Browser kesayangan anda.

Pertama, buka dulu dong Notepadnya. Cukup tekan Windows + R lalu ketikkan Notepad dan kemudian tekan Enter maka notepad pun akan terbuka dan siap untuk digunakan.

Lalu, ketiklah kode berikut ini :

<html>
<head>
<title>Memulai HTML</title>
</head>
<body>
Ini adalah HTML pertama saya
</body>
</html>

*Penjelasan :

semua kode html akan ditulis dalam tag <kode> dan hampir semuanya akan diakhiri dengan </kode>

kode html adalah kode wajib yang menandakan bahwa kode yang kita tuliskan adalah bahasa pemrogramman html. head adalah kode atas dari html, title adalah kode untuk penulisan judul halaman web yang akan ditampilkan nantinya, dan body adalah isi dari halaman web tersebut.

Simpanlah file tersebut dengan extensi .html, bagaimana caranya.?

Berikut ini caranya untuk menyimpan file dengan extensi .html pada notepad :

Pertama pilih All Files (“.”) pada kolom Save as type

Lalu ketikkan nama file dengan diakhiri extensi .html, maka jadilah fiel tersebut menjadi file html

*Catatan : kalau bisa nama file tidak menggunakan spasi ataupun symbol

*Catatan : kalau bisa nama file tidak menggunakan spasi ataupun symbol

Jika kode sudah kita ketikkan dan file pun sudah kita simpan maka sekarang saatnya kita eksekusi  dengan cara Klik 2x  file tersebut dan lihat hasilnya.

Berikut ini hasilnya :

Selesai sudah pembelajaran kita kali ini, terima kasih dan sampai ketemu lagi ya pada tutorial yang lainnya.

Read More