Tag Text, Header, List (Pembahasan HTML Bagian 4)

Melanjutkan materi Sebelumnya

Text

Paragraf

sebelum memulai kita buat dulu struktur HTML

<!DOCTYPE html>
<html>
<head>
	<title>Paragraf</title>
</head>
<body>
	<p>Ini Adalah Paragraf</p>
</body>
</html>

jika kalian ingin menabahkan paragraf lagi tinggal tulis di dalam <body></body> gini :

<p>ini adalah paragraf 1<p>
<p>ini adalah paragraf 2</p>

kalo kalian rasa jaraknya kurang, kalian bisa menggunakan tag   , contoh :

<p>ini adalah paragraf 1<p>
<br>
<p>ini adalah paragraf 2</p>

Dan kalian juga bisa membuat garis horizontal dengan menambahkan tag <hr>

<p>ini adalah paragraf 1<p>
<br>
<p>ini adalah paragraf 2</p>
<hr>

Bold

Untuk membuat text menjadi tebal (bold) kalian bisa menambahkan tag 

Italic

Untuk merubah text menjadi cetak miring kalian bisa menggunakan tag 

Underline

Untuk membuat text ada garis bawahnya kita bisa tambahkan tag 

Header

Header biasanya di gunakan untuk membuat sebuah judul artikel

<h1>Header 1</h1>
<h2>Header 2</h2>
<h3>Header 3</h3>
<h4>Header 4</h4>
<h5>Header 5</h5>
<h6>Header 6</h6>

Tag ini cuma ada sampe angka 6

List

Ada 3 tag untuk membuat list pada html
<ol>Ordered List</ol>, untuk membuat list terurut
<ul>Unordered List</ul>, untuk membuat list tidak terurut
<dl>Definition List</dl>, untuk membuat daftar terminologi dan definisi

langsung aja kita praketak aja

Ordered List<ol></ol>

pertama kita buka text editor kalian dan tulis di dalam <body></body> seperti ini

<h2>List Belajar</h2>
<ol>
	<li>HTML</li>
	<li>CSS</li>
	<li>JavaScript</li>
</ol>

kita bisa rubah bentuk urutannya dengan menambahkan atribut type

<ol type=””></ol>

Di dalam artibut itu kita bisa memasukan 5 type yaitu

1 (angka)
A (Huruf Besar)
a (huruf kecil)
I (Angka romawi Besar)
i (angka romawi kecil)

btw angka yang di buat oleh tag ini gak bisa di blok karna itu bagian dari tag html

Codingannya Jadi Mulai Susah di bedakan ya, untuk memisahkannya kita bisa pake tag komentar

<!-- Ini Adalah Komentar -->

Unordered List <ul></ul>

Kita mulai aja nulis di dalam <body></body> seperti ini

<h2>Makanan</h2>
<ul>
	<li>Baso</li>
	<li>Cilok</li>
	<li>Seblak</li>
</ul>

ketika membuat list tidak terurut (unordered list) itu urutannya tidak berpengaruh

Sama seperti ordered list, kita juga bisa merubah bentuk unordered list dengan menambahkan artibut type

<ul type=””></ol>

Kita bisa memasukan 3 type

disc
square
circle

Definition List <dl></dl>

List ini berbeda dengan list sebelumnya, tag ini di gunakan untuk terminologi

<dt></dt> dan descripsi <dd></dd>

<h2>Pemrogramanan Web</h2>
<dl>
	<dt>HTML</dt>
	<dd>Hypertext Markup Language</dd>
	<dt>CSS</dt>
	<dd>Cascading Style Sheet</dd>
</dl>

Nanti bagian deskripsi bakal di kasih endentasi oleh html

Destroyer Cyber Security