Langsung ke konten utama

HTML DAFTAR URUTAN

OBJEKTIF:
Setelah mempelajari materi ini diharapkan anda dapat memahami penggunaan element-element untuk pembuatan daftar urutan.

MATERI:
Element OL(ordered list), Element UL(unordered list), Element LI(list item).


ELEMENT OL (Orderd List)
Element OL berfungsi untuk membuat nomor daftar urut. Element ini mempunyai attribute yaitu start, dan type. Attribute start berfungsi untuk memberikan nilai awal dari daftar urutan, attribute type berfungsi untuk memilih bentuk daftar urutan yaitu A untuk abjad huruf besar, a untuk abjad huruf kecil, I untuk abjad romawi besar, i untuk abjad romawi kecil, 1 untuk angka decimal (default: start="1" type="1" ). Dalam element OL harus terdapat beberapa element LI.

Sintaks:
<ol start="number" type="A"|"a"|"I"|"i"|"1">
........................
</ol>



ELEMENT UL (Unordered List)
Element UL berfungsi untuk membuat daftar tanpa nomor urut (dalam format bullet). Element ini mempunyai attribute yaitu type. Attribute type berfungsi untuk memilih bentuk bullet yang digunakan. Nilai dari pada attribute type ini adalah "circle", "square" dan "disc" . Dalam element UL harus terdapat beberapa element LI.

Sintaks:
<ul  type="circle"|"square"|"disc">
      ..........................
</ul>



ELEMENT LI (List Item)
Element LI merupakan isi dari pada daftar. Element ini harus berada di dalam element OL atau UL. Element ini mempunyai attribute type dan value. Nilai attribute type adalah A,a,I,i,1,circle,square,disc dan attribute value berisikan nilai nomor urutan dari attribute type.

Sintaks:
<li type="A"|"a"|"I"|"i"|"1"|"circle"|"square"|"disc">
      ..........................
</li>





LATIHAN

Gunakan teks editor misalkan "Notepad" untuk menyunting dan menyimpan script latihan di bawah ini. Untuk melihat hasilnya bukalah file tersebut dengan menggunakan web browser atau gunakan editor yang telah tersedia pada modul ini dengan mengklik menu Editor.


Latihan 1:
Menampilkan teks dengan daftar urut (element OL):

                           Matakuliah TKJ Semester 1:
                           1. Bahasa Inggris  1
                           2. Matematika 1
                           3. Jaringan Komputer 1
                           4. Konsep Teknologi Informasi
                           5. Keterampilan Komputer dan Pengelolaan Informasi
                           6. Perangkat Keras Komputer
                           7. Sistem Operasi
                           

Nama file: latihan3_1.html

<html>
<head>
<title>Latihan3-1</title>
</head>
<body>
Matakuliah TKJ Semester 1:
<ol>
     <li>Bahasa Inggris 1</li>
     <li>Matematika 1</li>
     <li>Jaringan Komputer 1</li>
     <li>Konsep Teknologi Informasi</li>
     <li>Keterampilan Komputer dan Pengelolaan Informasi</li>
     <li>Perangkat Keras Komputer</li>
     <li>Sistem Operasi</li>
</ol>
</body>
</html>



Latihan 2:

Menampilkan teks dengan daftar urut (element OL):

                           Matakuliah TKJ Semester 1:
                           a. Bahasa Inggris  1
                           b. Matematika 1
                           c. Jaringan Komputer 1
                           d. Konsep Teknologi Informasi
                           e. Keterampilan Komputer dan Pengelolaan Informasi
                           f. Perangkat Keras Komputer
                           g. Sistem Operasi
                           

Nama file: latihan3_2.html

<html>
<head>
<title>Latihan3-2</title>
</head>
<body>
Matakuliah TKJ Semester 1:
<ol start="1" type="a">
     <li>Bahasa Inggris 1</li>
     <li>Matematika 1</li>
     <li>Jaringan Komputer 1</li>
     <li>Konsep Teknologi Informasi</li>
     <li>Keterampilan Komputer dan Pengelolaan Informasi</li>
     <li>Perangkat Keras Komputer</li>
     <li>Sistem Operasi</li>
</ol>
</body>
</html>


 


Latihan 3:
Menampilkan teks dengan daftar urut (element OL):

                       I. Matakuliah TKJ Semester 1:
                           a. Bahasa Inggris  1
                           b. Matematika 1
                           c. Jaringan Komputer 1
                           d. Konsep Teknologi Informasi
                           e. Keterampilan Komputer dan Pengelolaan Informasi
                           f. Perangkat Keras Komputer
                           g. Sistem Operasi
                           

Nama file: latihan3_3.html

<html>
<head>
<title>Latihan3-3</title>
</head>
<body>
<ol start="1" type="I">
<li>Matakuliah TKJ Semester 1:</li>
     <ol start="1" type="a">
        <li>Bahasa Inggris 1</li>
        <li>Matematika 1</li>
        <li>Jaringan Komputer 1</li>
        <li>Konsep Teknologi Informasi</li>
        <li>Keterampilan Komputer dan Pengelolaan Informasi</li>
        <li>Perangkat Keras Komputer</li>
        <li>Sistem Operasi</li>
     </ol>
</ol>
</body>
</html>


 

Tugas tambahan:
Ubahlah tampilannya dalam format kombinasi ordered list dan unordered list.

Komentar

Postingan populer dari blog ini

Sejarah Sistem Operasi dari DOS, Windows sampai Linux

Artikel ini akan menguraikan sejarah sistem operasi dari DOS, Mac, Windows, BSD, sampai Linux. 1980   QDOS : Tim Paterson dari Seattle Computer menulis QDOS yang dibuat dari OS terkenal pada masa itu, CP/M. QDOS (Quick and Dirty Operating System) dipasarkan oleh Seatle Computer dengan nama 86-DOS karena dirancang untuk prosesor Intel 8086. Microsoft : Bill Gates dari Microsoft membeli lisensi QDOS dan menjualnya ke berbagai perusahaan komputer. 1981   PC­ DOS : IBM meluncurkan PC­ DOS yang dibeli dari Microsoft untuk komputernya yang berbasis prosesor Intel 8086. MS­ DOS : Microsoft menggunakan nama MS­ DOS untuk OS ini jika dijual oleh perusahaan diluar IBM. 1983   MS­ DOS 2.0 : Versi 2.0 dari MS­ DOS diluncurkan pada komputer PC XT. 1984   System 1.0 : Apple meluncurkan Macintosh dengan OS yang diturunkan dari BSD UNIX. System 1.0 merupakan sistem operasi pertama yang telah berbasis grafis dan menggunakan mouse. MS ­DOS 3.0 : Microsoft meluncurkan MS DOS 3.0 untuk PC AT yang menggun...

pengertian Track Back

Trackback merupakan mekanisme pemberitahuan kepada pemilik weblog bahwa ada yang memiliki tema postingan yang sama dan menginginkan pemilik web menaut postingan yang sama tersebut Sejarah Spesifiksi protokol ini dimiliki Six Apart Akan tetapi implementasi pertama dilakukan pada piranti lunak (software) blogging Movable Type mereka pada Agustus 2002. Sebelumnya trackback sudah diimplementasikan pada perangkat (tool) blogging lain. Sejak bulan Februari 2006, Six Apart, membangun tim kerja untuk menyempurkan integrasi protokol trackback ke dalam platform blog mereka. Tujuannya agar bisa disetujui ETF dan bisa menjadi standar internet. Contoh Sebagai contoh, anda memiliki postingan dengan pranala http://domainanda.com/latihan-posting.html, lalu seseorang juga memposkan topik yang sama dengan anda dan mengisi formulir trackback dengan pranala anda seperti ini http://domainanda.com/latihan-posting.html/trackback. Ringkasan pos di blog anda tadi akan otomatis masuk ke komentar pos blo...

cara menambah speed IDM terbaru (ngeyel version)

  mau ?? punya kecepatan download pada IDM kamu kamu secepat ini???  saia kmaren mencoba-coba sebuah aplikasi yang mampu membuat kecepatan speedy saya wus wus wus sampai sedemikian rupa!!! kalian mau ama aplikasi ini??? oke,, nehhh,, sofwer ini harus di download pake torrent jadi saya sarankan anda pake torrent donloder saya MEDIAGET torrent sofwernya donlot DISINI oke sekian, tq sebelum dan ssudahnya,,, kalo ada pertanyaan kommen aja yaaa,,,