UL Tagı Nasıl Kullanılır?

Etiketi madde işaretleri şeklinde olan listeler yapmak için kullanılır.

 UL Tagı Nasıl Kullanılır?

<ul>
 <li>Abit</li>
 <li>Kemal</li>
 <li>Veli</li>
 <li>İdris</li>
 <li>Yalçın</li>
 <li>Murat</li>
 <li>Ahmet</li>
</ul>

  Yukardaki kodların ekran çıktısı aşağıdaki gibidir

UL Tag
Parametre Değer Açıklama HTML5 HTML 4.01
type disc, square, circle Listenin hangi sembolle gösterileceğini belirtir. Kullanılıyor Kullanılması İstenmiyor

 

<ul type="circle">
 <li>Abit</li>
 <li>Kemal</li>
 <li>Veli</li>
 <li>İdris</li>
 <li>Yalçın</li>
 <li>Murat</li>
 <li>Ahmet</li>
</ul>
       
<ul type="disc">
 <li>Abit</li>
 <li>Kemal</li>
 <li>Veli</li>
 <li>İdris</li>
 <li>Yalçın</li>
 <li>Murat</li>
 <li>Ahmet</li>
</ul>
       
<ul type="square">
 <li>Abit</li>
 <li>Kemal</li>
 <li>Veli</li>
 <li>İdris</li>
 <li>Yalçın</li>
 <li>Murat</li>
 <li>Ahmet</li>
</ul>

  Yukardaki kodların ekran çıktısı aşağıdaki gibidir

 

UL Tag
 
<!DOCTYPE html>
<html>
<head>
<style>
li {display:inline-block; border:1px solid red; padding:5px;}
li:hover {
        background-color:red;
}

ul > li > ul > li {
        position:realtive;
        display:block; border:1px solid green; padding:5px;
    background-color:green;
}

ul > li > ul {
        position:absolute;
        display:none;
}
ul > li:hover > ul {
        display:block;
}
li:hover a {
            color:white;
}
</style>
</head>
<body>

<ul>
  <li><a href="#home">Home</a></li>
  <li>
                <a href="#news">News</a>
        <ul>
                <li>Akşam</li>
            <li>Sabah</li>
            <li>Millet</li>
        </ul>
  </li>
  <li><a href="#contact">Contact</a></li>
  <li><a href="#about">About</a></li>
</ul>

<p>Note: We use href="#" for test links. In a real web site this would be URLs.</p>

</body>
</html>
 

 

UL Tagı Nasıl Kullanılır?
Yorumunuzu Ekleyin


Yükleniyor...
Yükleniyor...