sesii 4

Oleh

Assalamualikum wr. wb.
Kali ini saya akan membahas Pembuatan List Beserta kombinasi dengan Dokumen HTML
Pengertian List HTML :
  • List (daftar) merupakan bagian teks didalam dokumen yang berisi daftar item dari suatu kelompok atau grup tertentu. Sebagai contoh dalam situs web yang bertema kuliner, list dapat berupa daftar dari makanan dan minuman, beserta harganya. List dapat juga berupa prosedur (urutan langkah – langkah ) dari suatu pekerjaan tertentu, yang sifatnya harus dilakukan secara berurutan dari langkah pertama sampai langkah terakhir.

  • Contoh list :


Nah.. bagaimana cara membuat list seperti di atas menggunakan HTML berikut saya aka menjelaskan
Tipe – tipe daftar dalam HTML.

Tipe daftar dalam dokumen HTML :
·         Dalam dokumen HTML, tipe daftar dibedakan menjadi tiga :
      1.       Daftar berurutan (ordered list) <ol></ol>
 2.       Daftar tidak berurutan (undordered list) <ul></ul>
 3.       Daftar definisi (definition list) <dl>

Daftar Berurutan (ordered list) <ol></ol>
·         Daftar yang berurutan biasanya ditandai dengan penggunaan penomoran tertentu.
·         Penomoran ini bisa menggunakan angka  (1, 2, 3,…)
·         Karakter alphabet (a, b, c, … atau i, ii, iii, … )
                  Daftar yang berurutan umumnya dipakai untuk item – item yang saling berhubungan satu sama                          lain, atau untuk menuliskan langkah – langkah atau prosedur dari kegiatan yang tidak dapat                                 dilakukan secara acak

·         Contoh penulisan tag <ol> adalah :



Daftar Tidak Berurutan (unordered list).
Diawali dengan tag <ul> (undered list), yang diakhiri tag </ul>.

Contoh penulisannya sebagai berikut:



Atribut untuk tag undordered list :



Daftar Definisi (Definiton List)

Daftar Definition merupakan suatu daftar yang berisi kumpulan definisi dari suatu istilah tertentu, contohnya seperti berikut :


Pembuatan list kombinasi :

Dalam pembuatan list kombinasi ini menggabungkan ordered list (<ol>) dan undordered list (<ul>.
Untuk membuat daftar ini di HTML cukup menggabungkan <ol> dengan <ul>.

Berikut contoh list kombinasi :

Berikut adalah cara penulisan di htmlnya :



Berikut nya Pembuatan list kombinasi dengan menggunakan nomor :

Nah disini tinggal menambahkan atribut start pada kode html contoh nya seperti berikut :

                     <ol start=”1”>
                                <li>Urutan satu</li>
                                <li>Urutan kedua</li>
                     </ol>

Nah pada kode diatas saya memulai dengan angka 1 dan seterusnya.

Selanjutnya pembuatan list kombinasi dengan menggunakan huruf 
contoh : 
                     <ol type="A">
                                <li>Urutan satu</li>
                                <li>Urutan kedua</li>
                     </ol>

Nah sebenarnya sama saja seperti sebelumnya hanya saja disini angka nya diubah menjadi huruf dan atribut start diubah menjadi type.


Berikutnya saya akan menampilkan beberapa contoh penggunaan kode list di html :

1. Ordered List :



Hasilnya :



2. List kombinasi 



Hasilnya : 



3. List kombinasi 


Hasilnya :


4. Definition list


Hasilya :

5. Biodata
Hasil nya :


sekian dari saya terimakasih wasslamualaikum wr. wb...


Komentar

Posting Komentar

Postingan populer dari blog ini

Oleh
Gambar
Tugas Program Dasar 1.#include <iostream>   using namespace std;   int(){                 int c                 printf("Masukan nilai : ");                 scanf ("%d" , c);                 printf("Nilai yang anda masukkan adalah = %i", c);                 return 0;}   Kode program di atas memiliki kesalahan penulisan sehingga program tidak dapat dijalankan , kesalahan tersebut adalah ...   (E.Penggunaan Header yang Salah , karena fungsi printf() atau scanf() menggunakan header <stdio.h>) 2.untuk menjalankan operasi I/O terdapat beberapa kelas yang harus d...
Baca selengkapnya

BASIC DASAR CODE::BLOCKS

Oleh
Gambar
Assalamualaikum.. Ok,, gan sebelumnya saya udah berbagi ilmu nih bagaimana caranya menginstal code blocks v17.12 Nah.. kali ini saya akan terusin materi pengalaman saya belajar sebagai siswa RPL... yaitu basic  dasar pemrograman di codeblocks.. ok lah let’s do it… Sebelumnya saya saranin doa dulu biar berkah belajarnya gan…hhe.. Pertama pastinya nyalain dulu computer anda dan buka aplikasi codeblocks Nah kalau udah kebuka klik file > new  > empty file atau bisa juga ctrl + shift + N biar cepet aje gan.. kemudian save ( ctrl + S ) bebas dimana aja,, lalu tambahin .cpp misal belajar.cpp   Second.. (inggris dikit lh biar keren. hhee..) kita mulai proses codingannya.. Pertama anda harus alias wajib  tulis     #include <iostream>  lalu   enter  using namespace std; di setiap  awal codingan. Selanjutnya tinggal pelajari dan masukin code berikut.. tugas 2 #...
Baca selengkapnya

sesi 6

Oleh
Gambar
Assalamualaikum wr. wb Bertemu lagi dengan saya yang kali ini akan memberikan beberapa conoth layout website beserta source code nya. 1. Yang pertama adalah TopIndex, kalian bisa lihat dan pelajari code berikut : Dan hasil dari source code di atas adalah sebagai berikut : 2. Bottom Index Hasilnya akan seperti gambar dibawah ini: 3.Left Index Hasilnya seperti berikut : 4. Layout Split Dan hasilnya seperti berikut : Nahh .. itu tadi beberapa contoh layout yang sering digunakan dalam website. selanjutnya saya kalian bisa isi content atau yang lain nya sesua dengan keinginan kalian. contohnya saya membuat dan mengisi dari satu layout di atas sebagai berikut : Source Code : Hasil dari sourc Code nya seperti dibah ini : Ok.. itu tadi beberapa contoh layout website. Terimakasih atas kunjungan nya, mohon maaf apabila banyak kesalahan.. Wassalamualaikum wr. wb.
Baca selengkapnya