SORU
15 Mart 2011, Salı


UL/Lİ ayarı kurşun renkler veya resimler span etiketleri kullanmadan CSS ile listeler

Basit sıralı olmayan bir liste, <li> bazı öğeler <ul> etiketleri iç içe hayal. Şimdi, kurşunlar <li> öğeleri color: #F00; sonra rengini ayarlayın eğer Kare list-style:square;) ancak şeklinde tanımlanmıştırher şeyikırmızı olur!

Ben SADECE bu Kare mermi rengini ayarlamak ister. Ne zarif bir kod CSS tek kurşun rengi tanımlar? Hareketli görüntüleri veya span etiketleri kullanmadan zarif anlamı.

HTML

<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<ul>

CSS

li{
   list-style:square;
}

CEVAP
15 Mart 2011, Salı


Bunu yapmanın en yaygın yolu, bu satırlar boyunca bir şey

ul {
    list-style: none;
    padding:0;
    margin:0;
}

li { 
    padding-left: 1em; 
    text-indent: -.7em;
}

li:before {
    content: "• ";
    color: red; /* or whatever color you prefer */
}

Canlı demo: http://jsfiddle.net/leaverou/ytH5P/

Tüm tarayıcılar, sürüm 8 ve IE de dahil olmak üzere çalışacak.

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • Hey Nadine

    Hey Nadine

    24 Kasım 2006
  • Moto Journal

    Moto Journal

    28 Mayıs 2007
  • undrmyumbrellaa

    undrmyumbrel

    25 Temmuz 2012