2016-07-28 61 views
1

我做一個簡單的表格,並希望像您可以使用CSS tr:nth-child(even){background-color: #f2f2f2;}備用背景顏色

因爲我使用IDS試圖鏈接到CSS與表格形式交替每個選項的背景顏色不同的背景顏色:

function options(){ 
     var i =0; 
     var name; 
     $(xmlDoc).children().children().each(function(){ 
      name = $(this).children().first().text(); 
      if(i % 2 == 0){ 
       $('form').append(" <input type='checkbox' id=odd'" + "value=" + name + ">"+ name + "<br>"); 
      } 
      else{ 
       $('form').append(" <input type='checkbox' id='even'" + "value=" + name + ">"+ name + "<br>"); 
      } 
      i++; 
     }); 
    } 

但發現你只能通過在窗體中指明它來改變背景顏色。有沒有其他方法可以做到這一點?

+0

如果你可以設置一個'jsfiddle',它會更容易解決 – tcasey

+0

http://stackoverflow.com/questions/4148499/how-to-style-checkbox-using-css – yuriy636

回答

0

要改變形式的你有顏色從形式

<form style="background-color: #E0FFFF"></form>

調用它並不能對特定輸入任何東西。 爲了解決這個問題,我發現,你必須把整個事情到一個列表,然後可以使用

li:nth-child(even) {background-color: #f2f2f2;}

你的CSS裏面。該HTML看起來像這樣:

<ul style='list-style-type: none;><li><input type='checkbox' id='name' value='name'>name<br></li></ul>

的UL的造型擺脫要點。

2

您是否嘗試過:

input[type="checkbox"]:nth-of-type(2n-1) { 
background-color: #222222; 
} 

input[type="checkbox"]:nth-of-type(2n) { 
background-color: #f2f2f2; 
}