2017-08-30 84 views
-1

我有這樣的代碼:ID屬性選擇^不起作用

#ul_quests { 
 
    list-style: none; 
 
    font-size: 20px; 
 
    margin: 0; 
 
    padding: 0; 
 
    text-align: center; 
 
} 
 

 
[id=^"q_count"], 
 
[id="q_watcher"], 
 
[id=^"q_date"], 
 
[id=^"q_addresses"] { 
 
    height: 55px; 
 
    line-height: 55px; 
 
    float: left; 
 
    margin: 0px 35px; 
 
}
<ul id="ul_quests"> 
 
    <li id='q_count1'>1</li> 
 
    <li id='q_watcher1'>fdsfss</li> 
 
    <li id='q_date1'>20-20</li> 
 
    <li id='q_addresses1'></li> 
 
</ul>

但CSS並不適用於的ID。 JSFiddle

回答

4

[id^="q_count"]是正確的方法。 [id=^"q_count"]這不是

#ul_quests{ 
 
    list-style: none; 
 
    font-size: 20px; 
 
    margin: 0; 
 
    padding: 0; 
 
    text-align: center; 
 
} 
 

 
[id^="q_count"],[id="q_watcher"],[id^="q_date"],[id^="q_addresses"]{ 
 
    height: 55px; 
 
    line-height: 55px; 
 
    float: left; 
 
    margin: 0px 35px; 
 
}
<ul id="ul_quests"> 
 
    <li id='q_count1'>1</li> 
 
    <li id='q_watcher1'>fdsfss</li> 
 
    <li id='q_date1'>20-20</li> 
 
    <li id='q_addresses1'></li> 
 
</ul>