Pemrograman Web:HTML 2: Difference between revisions
| (12 intermediate revisions by the same user not shown) | |||
| Line 131: | Line 131: | ||
Contoh dokumen: | Contoh dokumen: | ||
<code><html> | |||
<head> | |||
<title>Mencoba membuat daftar dengan order list</title> | |||
</head> | |||
<body> | |||
<ol> | |||
Ini adalah warna-warni pada pelangi: | |||
<hr> | |||
<li>Merah</li> | |||
<li>Jingga</li> | |||
<li>Kuning</li> | |||
<li>Hijau</li> | |||
<li>Biru</li> | |||
<li>Nila</li> | |||
<li>Ungu</li> | |||
</ol> | |||
</body> | |||
</html></code> | |||
Membuat Daftar dalam Daftar (Nested Ordered List):<syntaxhighlight lang="html" line="1"> | |||
<html> | |||
<head> | |||
<title>Mencoba membuat daftar dengan order list</title> | |||
</head> | |||
<body> | |||
<h2>Planet dalam tata surya</h2> | |||
<hr> | |||
<ol> | |||
<li>Merkurius</li> | |||
<ol> | |||
<li>57.9 juta kilometer dari matahari</li> | |||
<li>tidak punya satelit</li> | |||
</ol> | |||
<li>Venus</li> | |||
<ol> | |||
<li>108 juta kilometer dari matahari</li> | |||
<li>tidak punya satelit</li> | |||
</ol> | |||
<li>Bumi</li> | |||
<ol> | |||
<li>149.6 juta kilometer dari matahari</li> | |||
<li>satu satelit = Bulan</li> | |||
</ol> | |||
<li>Mars</li> | |||
<ol> | |||
<li>227.9 Juta kilometer dari matahari</li> | |||
<li>Dua satelit</li> | |||
<ol> | |||
<li>Phobos</li> | |||
<li>Deimos</li> | |||
</ol> | |||
</ol> | |||
</ol> | |||
</body> | |||
</html> | |||
</syntaxhighlight> | |||
=== Atribut pada <code><nowiki><OL></nowiki></code> === | |||
{| class="wikitable" | |||
|+ | |||
!ATRIBUT | |||
!FUNGSI | |||
|- | |||
|TYPE=A | |||
|Membuat daftar berurut dengan huruf besar (A, B, C…) | |||
|- | |||
|TYPE=a | |||
|Membuat daftar berurut dengan huruf kecil (a, b, c…) | |||
|- | |||
|TYPE=I | |||
|Membuat daftar berurut dengan huruf romawi besar (I,II,III,IV) | |||
|- | |||
|TYPE=i | |||
|Membuat daftar berurut dengan huruf kecil (i,ii,iii,iv,…) | |||
|- | |||
|TYPE=1 | |||
|Membuat daftar berurut dengan huruf kecil (1,2,3,…) | |||
|- | |||
|START=n | |||
|Menentukan nilai awal dari item dalam daftar, n=nilai awal | |||
|} | |||
==== Contoh ==== | |||
<syntaxhighlight lang="html" line="1" start="9"> | |||
<li>Merkurius</li> | |||
<ol type="A"> | |||
<li>57.9 juta kilometer dari matahari</li> | |||
<li>tidak punya satelit</li> | |||
</ol> | |||
</syntaxhighlight> | |||
== 2. Uuordered List <code><nowiki><ol></nowiki></code> == | |||
* Ordered List atau Bulleted List adalah suatu daftar dimana urutan item-item tidak diutamakan. Item-tem ditampilkan dalam semabarng urutan. | |||
* Setiap item dalam Unordered list biasanya ditandai dengan bulatan, kotak atau lingkaran. | |||
* Ordered List dimulai dengan tag awal <nowiki><OL> dan diakhiri dengan tag akhir </nowiki><code><nowiki></OL></nowiki></code> | |||
* Diantara kedua tag tersebut terdapat tag <nowiki><LI> yang menyatakan list item.</nowiki> | |||
<syntaxhighlight lang="html" line="1"> | |||
<html> | |||
<head> | |||
<title>Mencoba membuat daftar dengan unordered list</title> | |||
</head> | |||
<body> | |||
<h2>Planet dalam tata surya</h2> | |||
<hr> | |||
<ul> | |||
<li>Merkurius</li> | |||
<ul> | |||
<li>57.9 juta kilometer dari matahari</li> | |||
<li>tidak punya satelit</li> | |||
</ul> | |||
<li>Venus</li> | |||
<ul> | |||
<li>108 juta kilometer dari matahari</li> | |||
<li>tidak punya satelit</li> | |||
</ul> | |||
<li>Bumi</li> | |||
<ul> | |||
<li>149.6 juta kilometer dari matahari</li> | |||
<li>satu satelit = Bulan</li> | |||
</ul> | |||
<li>Mars</li> | |||
<ul> | |||
<li>227.9 Juta kilometer dari matahari</li> | |||
<li>Dua satelit</li> | |||
<ul> | |||
<li>Phobos</li> | |||
<li>Deimos</li> | |||
</ul> | |||
</ul> | |||
</ul> | |||
</body> | |||
</html> | |||
</syntaxhighlight> | |||
=== Atribut pada <code><nowiki><ul></nowiki></code> === | |||
{| class="wikitable" | |||
|+ | |||
!ATRIBUT | |||
!FUNGSI | |||
|- | |||
|TYPE=circle | |||
|Membuat tanda lingkaran ○ | |||
|- | |||
|TYPE=square | |||
|Membuat tanda kotak □ | |||
|- | |||
|TYPE=disc | |||
|Membuat tanda cakram ● | |||
|} | |||
<syntaxhighlight lang="html" line="1"> | |||
<html> | |||
<head> | |||
<title>Mencoba membuat daftar dengan unordered list</title> | |||
</head> | |||
<body> | |||
<h2>Planet dalam tata surya</h2> | |||
<hr> | |||
<ul> | |||
<li>Merkurius</li> | |||
<ul type="circle"> | |||
<li>57.9 juta kilometer dari matahari</li> | |||
<li>tidak punya satelit</li> | |||
</ul> | |||
<li>Venus</li> | |||
<ul type="square"> | |||
<li>108 juta kilometer dari matahari</li> | |||
<li>tidak punya satelit</li> | |||
</ul> | |||
<li>Bumi</li> | |||
<ul type="disc"> | |||
<li>149.6 juta kilometer dari matahari</li> | |||
<li>satu satelit = Bulan</li> | |||
</ul> | |||
</ul> | |||
</body> | |||
</html> | |||
</syntaxhighlight> | |||
== 3. Definition List == | |||
* Definition List adalah suatu jenis daftar khusus yang berbeda jauh dengan daftar-daftar sebelumnya. | |||
* Definition List digunakan untuk mendefinisikan atau menjelaskan istilah-istilah yang disebut Glosarry List (Daftar Istilah) | |||
* Definition List dinyatakan dengan tag awal <code><nowiki><dl></nowiki></code> dan tag akhir <code><nowiki></dl></nowiki></code>. Dalam tag tersebut ada dua bagian yaitu: | |||
** Istilah yang akan didefinisikan, dinyatakan dengan tag tunggal <code><nowiki><dt></nowiki></code> atau Definition Term | |||
** Definisi dari istilah tersebut dinyatakan dengan tag tunggal <code><nowiki><dd></nowiki></code> atau Definition Data | |||
* Browser akan menampilkan istilah yang didefinisikan pada baris tersendiri, Kemudian definisinya ditampilkan pada baris berikutnya dengan suatu indentasi. | |||
<syntaxhighlight lang="html" line="1"> | |||
<html> | |||
<head> | |||
<title>Mencoba DEFINITION LIST</title> | |||
</head> | |||
<body> | |||
<h2>Planet dalam sistem Tata Surya</h2> | |||
<hr> | |||
<dl> | |||
<dt>Merkurius</dt> | |||
<dd>Planet paling kecil dan paling dengan matahari, berevolusi dengan matahari selama 88,8 hari. | |||
Jarak dari matahari adalah 58,3 juta kilometer (36,2 juta mil) dan mempunyai ukuran radius | |||
kira-kira 2,414 kilometer (1,500 mil)</dd> | |||
<dt>Venus</dt> | |||
<dd>Planet kedua dari matahari, mempunyai ukuran radius 6,052 kilometer (3,760 juta mil), berat | |||
0,815 dari bumi, berevolusi dengan matahari selama 224,7 hari, dan berjarak kira-kira | |||
100,1 kilometer (62,2 juta mil)</dd> | |||
<dt>Bumi</dt> | |||
<dd>Bumi ketiga dari matahari, berevolusi dengan matahari selama 365.26 hari, berjarak 149 juta | |||
kilometer, berputar pada prosnya selama 23 jam 56,07 menit, mempunyai radius 6,374 kilometer | |||
dan mempunyai berat kira-kira 29,11 x 10^24 kilogram.</dd> | |||
</dl> | |||
</body> | |||
</html> | |||
</syntaxhighlight> | |||
[[Category:Materi]] | |||
[[Category:Matkul]] | |||
[[Category:Pemrograman Web]] | |||