影響力，而不必每堂課裏

很抱歉，如果我問一個已經在別處回答的問題......我無法找到答案，也許是因爲我不知道該怎麼問了。影響力，而不必每堂課裏

但我想弄清楚如何通過設置ul的類來影響列表項，所以我只需要在ul中調用類而不必爲每個列表項調用類。

我有一個藍點圖標和一個綠點圖標列表。

我希望能夠做到這一點

<ul class="greendot"> 

    <li>list item 1</li> 
    <li>list item 2</li> 
    <li>list item 3</li> 
    <li>list item 4</li> 
</ul>

與CSS像這樣：

ul.greendot { 

    list-style-image: url(http://greendot.jpg); 
}

謝謝！

來源

2014-02-10 user3294433

看起來很好。應該管用？你有問題嗎？描述問題。你的網址是否正確？它看起來有點奇怪... –

你的代碼是正確的。如果你有問題，那麼你有問題，因爲圖像URL是錯誤的。 – Zafar

我建議您刪除子彈在UL，然後添加一個背景圖片樣式每個L1 ...

的風格應該是這樣的......

ul 
{ 
list-style-type: none; 
padding: 0px; 
margin: 0px; 
} 
ul.greendot li 
{ 
background-image: url(greendot.png); 
background-repeat: no-repeat; 
background-position: 0px 5px; 
padding-left: 14px; 
}

和html的身體看起來像這樣...

test 
<ul class="greendot"> 
<li>test 1</li> 
<li>test 2</li> 
</ul>

來源

2014-02-10 20:01:10 tintyethan

看到的，如果你的CSS是ul.greendot那麼它會爲<ul class="greendot"> ....</ul> 工作，如果你的CSS是唯一爲ul然後它將爲兩個ul列表工作。

<!DOCTYPE html> 
<html> 
<head> 
<style> 
    /* only for greendot ul */ 
    ul.greendot 
    { 
    list-style-image:url('http://greendot.jpg'); 
    } 

/* For both ul */ 
ul 
    { 
    list-style-image:url('http://greendot.jpg'); 
    } 
</style> 
</head> 

<body> 
<ul class="greendot"> 
    <li>list item 1</li> 
    <li>list item 2</li> 
    <li>list item 3</li> 
    <li>list item 4</li> 
</ul> 
<ul class="reddot"> 
    <li>list item 1</li> 
    <li>list item 2</li> 
    <li>list item 3</li> 
    <li>list item 4</li> 
</ul> 
</body> 
</html>

來源

2014-02-10 20:04:07 RealDeepak

影響力，而不必每堂課裏

回答

相關問題