ट्विटर बूटस्ट्रैप

Question

के बजाय का उपयोग करते समय कलर टेबल हेडर पंक्ति रंग बदल नहीं रहा है मेरी रेल में 3.2 आवेदन मुझे एक टेबल प्रदर्शित करना है। तो मैंने इसे प्रारूपित करने के लिए ट्विटर बूटस्ट्रैप की कक्षा "टेबल टेबल-बोर्डर्ड" का उपयोग किया। और उसके बाद इसकी पंक्तियों को बदलने के लिए मैंने वर्ग "जानकारी" और "सफलता" का भी उपयोग किया here।

मेरा पेज में तालिका कोड इस प्रकार है: -

<table class="table table-bordered"> 
    <tr class="info"> 
    <th>Your Links</th> 
    <th></th> 
    <th></th> 
    <th></th> 
    </tr> 

<% @links.each do |link| %> 
    <tr class="success"> 
    <td><%= link_to linkbunch_url(link.link), linkbunch_url(link.link) %></td> 
    <td><%= link_to 'Show', linkbunch_url(link.link) %></td> 
    <td><%= link_to 'Edit', edit_url(link.link) %></td> 
    <td><%= link_to 'Destroy', destroy_url(link.link), method: :delete, data: { confirm: 'Are you sure ?' } %></td> 
    </tr> 
<% end %> 
</table> 

पता है क्या यह पहली पंक्ति तालिका के सिर पंक्ति है सिवाय इसके कि सभी पंक्तियों रंग बदल रहा है। लेकिन जब " से " बदल गया तो यह ठीक काम कर रहा है। लेकिन क्योंकि यह एक साधारण पंक्ति है जो टेबल हेडर पंक्ति नहीं है, इसलिए फ़ॉन्ट्स बोल्ड प्रकार नहीं हैं।

तो कैसे के बजाय का उपयोग किए बिना हेडर पंक्ति के रंग बदलने के लिए ??

धन्यवाद ...

Answer 1

वहाँ तालिका शीर्ष लेख को .info या .success जोड़ने के लिए बूटस्ट्रैप में कोई सीएसएस है। आपको खुद को नियम बनाना है।

.table tbody tr.info th { 
    background-color: #d9edf7; 
} 

jsfiddle

Answer 2

<table class="table table-bordered"> 
    <thead> 
    <tr class="info"> 
     <th>Your Links</th> 
     <th></th> 
     <th></th> 
     <th></th> 
    </tr> 
    </thead> 
    <tbody> 
<% @links.each do |link| %> 
    <tr class="success"> 
    <td><%= link_to linkbunch_url(link.link), linkbunch_url(link.link) %></td> 
    <td><%= link_to 'Show', linkbunch_url(link.link) %></td> 
    <td><%= link_to 'Edit', edit_url(link.link) %></td> 
    <td><%= link_to 'Destroy', destroy_url(link.link), method: :delete, data: { confirm: 'Are you sure ?' } %></td> 
    </tr> 
<% end %> 
    </tbody> 
</table>