Apa itu ul dan li di html?

Question

In the following lines of CSS code:

Table of Contents Show

Apa fungsi ul dan li pada HTML?
Apa itu ol dan li pada HTML?
Apa itu Li dalam HTML?
Apa perbedaan antara tag ol dan ul?

.sf-menu li:hover ul, .sf-menu li.sfHover ul {top: 40px!important; }

What do the HTML tags <ul> and <li> mean?

asked Jul 2, 2012 at 22:12

Arthur Mamou-ManiArthur Mamou-Mani

2,25310 gold badges42 silver badges65 bronze badges

1

It's from the HTML elements of the same name.

UL - Unordered List (an ordered, or numbered, list would be OL)
LI - List Item

answered Jul 2, 2012 at 22:13

craig65535craig65535

3,2891 gold badge22 silver badges48 bronze badges

ul stands for unordered list.

li stands for list item.

They are the HTML tags for "bulleted" lists as opposed to "numbered" lists (which are specified by ol for ordered list).

answered Jul 2, 2012 at 22:14

tskuzzytskuzzy

35.2k14 gold badges70 silver badges136 bronze badges

They target <ul> and <li> elements in the page.

In CSS an id is prefixed by #, a class is prefixed by ., and an element has no prefix at all.

So the selector .sf-menu li:hover ul will apply to any <ul> element, inside an <li> element that you are currently pointing at, inside an element with class="sf-menu".

The selector .sf-menu li.sfHover ul will apply to any <ul> element, inside an <li> element with class="sfHover", inside an element with class="sf-menu".

answered Jul 2, 2012 at 22:13

GuffaGuffa

672k108 gold badges718 silver badges991 bronze badges

If you're seeing this message, it means we're having trouble loading external resources on our website.

If you're behind a web filter, please make sure that the domains *.kastatic.org and *.kasandbox.org are unblocked.

HTML element ul (un-ordered list) merupakan elemen HTML yang digunakan untuk menampilkan daftar (list) dalam bentuk butir-butir peluru atau bulet. Daftar list yang ditampilkan tidak dalam bentuk urutan angka maupun huruf namun ditampilkan dalam bentuk bulet atau titik kecil sebagai penanda daftar. Penggunaan elemen ini biasanya untuk daftar/list yang bersifat non-formal atau tak resmi.

HTML element <ul> (un-ordered list) ini juga bisa disebut sebagai daftar acak untuk menampilkan daftar item secara acak tanpa penomoran yang formal. Penulisan elemen ini dibuka dengan tag <ul> dan ditutup dengan </ul>. Isi butir-butir daftar dimasukkan di dalam <li> (list item) di antara tag <li> dan <li>. Setiap item daftar nantinya akan ditampilkan dalam bentuk butir-butir bulet oleh HTML.

Berikut ini contoh penggunaan <ul> (un-ordered list) :

<!DOCTYPE html>
<html>
<head>
   <title>Latihan Menggunakan HTML Element UL (Un-ordered List)</title>
</head>
<body>
   <h2>Belajar Menggunakan HTML Element UL</h2>
   <p>Nama jenis buah :</p>
   <ul>
     <li>Apel</li>
     <li>Durian</li>
     <li>Pepaya</li>
     <li>Pisang</li>
     <li>Jeruk</li>
   </ul>
</body>
</html>

Jika dijalankan, maka akan menghasilkan tampilan:

Menggunakan Atribut "TYPE"

Secara default, HTML element <ul> (un-ordered list) ditampilkan dalam bentuk bulatan kecil dengan type "disc". Nilai "disc" ini merupakan bulet berupa titik hitam bulat yang melingkar di depan setiap daftar. Atribut type pada HTML element <ul> memiliki 3 buah nilai yaitu "disc" (bulatan solid), "square" (kotak), dan "circle" (lingkaran berlubang). Untuk melihat nilai tampilan bentuk butir-butir bulet lainnya, berikut ini kode berbagai type daftar <ul> (un-ordered list) :

<!DOCTYPE html>
<html>
<head>
   <title>Latihan Menggunakan HTML Element UL (Un-ordered List)</title>
</head>
<body>
   <h2>Belajar Menggunakan HTML Element UL</h2>
   <p>HTML Element UL (Un-ordered List) dengan berbagai type tampilan</p>
     <ul type="disc">
     <li>Apel</li>
     <li>Durian</li>
     <li>Pepaya</li>
     <li>Pisang</li>
     <li>Jeruk</li>
   </ul>      <ul type="square">
     <li>Apel</li>
     <li>Durian</li>
     <li>Pepaya</li>
     <li>Pisang</li>
     <li>Jeruk</li>
   </ul>
      <ul type="circle">
     <li>Apel</li>
     <li>Durian</li>
     <li>Pepaya</li>
     <li>Pisang</li>
     <li>Jeruk</li>
   </ul>
</body>
</html>

Jika dijalankan, maka akan menghasilkan halaman seperti dibawah ini :

Browser Pendukung :

Global Attributes :

Tag <ul> mendukung Global Atribut di dalam HTML yang artinya bahwa pada tag ini dapat sisipkan atribut yang bersifat global yang secara umum berlaku pada semua komponen tag HTML.
Silahkan kunjungi Atribut Global Pada HTML untuk mengetahui detail global atribut pada HTML

Event Attributes :

Tag <ul> mendukung Event Atribut atau atribut acara (kejadian). Atribut acara ini merupakan wilayah javascript tentang bagaimana menampilkan halaman web. Misalnya saat halaman web sedang loading (onload) sampai interaksi user pada halaman web tersebut seperti scrolling layar (onscroll), menekan tombol pada keyboard (onkeypress, onkeydown), mengarahkan mouse (onmouseover) dan lainnya.
Silahkan kunjungi Event Atribut Pada HTML untuk mengetahui detail event atribut pada HTML.

Pengaturan Default CSS :

Nilai default pengaturan gaya untuk elemen <ul> pada HTML:

ul{
   display: block;
   list-style-type: disc;
   margin-top: 1em;
   margin-bottom: 1em;
   margin-left: 0;
   margin-right: 0;
   padding-left: 40px;
}

27 Jul 2022

Apa fungsi ul dan li pada HTML?

Deskripsi. Penjelasan HTML ul Untuk menulis sebuah item dalam daftar (list), digunakan element <li> yang menunjukkan List Item. Jadi, <li> terletak didalam <ul> dan dapat ditulis lebih dari satu element. <ul> juga bisa saja terletak (ditulis) didalam <li> yang menunjukkan tingkatan daftar (list) bersarang (nested).

Apa itu ol dan li pada HTML?

Ordered List di HTML. Ordered list dibuat dengan tag <ol> . Lalu di dalamnya diisi dengan item-item yang akan dimasukkan ke dalam list. Item dibuat dengan tag <li> (list item).

Apa itu Li dalam HTML?

Fungsi li pada html adalah untuk menampilkan item pada unordered dan ordered list. Sedangkan pada description list tidak menggunakan tag <li>.

Apa perbedaan antara tag ol dan ul?

Tag Ol atau ordered list adalah suatu tag untuk mengurutkan daftar dengan menggunakan angka, abjad dan angka romawi pada HTML. Sedangkan ul atau unordered list yaitu tag untuk mengurutkan daftar dengan menggunakan symbol atau special character pada HTML.

Unordered List adalah

Ul li number