覆蓋<tr>造型爲使用sass

我目前正在研究一個rails應用程序，我想用背景顏色突出顯示一行，但除此之外，在該行內突出顯示不同顏色的數據單元。覆蓋<tr>造型爲使用sass

我的問題是td的樣式似乎被忽略。我只是得到整行的背景顏色。

檢查CSS客戶端看來，我申請td的樣式根本不存在。

生成的HTML

<table id="project-table" class="table table-hover"> 
    <thead> 
    <tr> 
     <th>Row</th> 
     <th>Fubar</th> 
    </tr> 
    </thead> 

    <tbody> 
    <tr class="clickable-row cheese"> 
     <td>Row 1</td> 
     <td class="'wibble'">Hello World</td> 
    </tr> 
    </tbody> 
</table>

的青菜

#project-table tbody tr.cheese { 
    background-color: yellow; 

    & td.wibble { 
    background-color: blue; 
    } 
}

我在做什麼錯？

ps：使用引導程序3，但我不認爲這與這個問題有關，是嗎？

UPDATE [解決]

好吧，看來我是瞎子，沒有意識到一組額外的雙引號，正在爲class="'wibble'"產生的 - 感謝@Dekel快速指出了這一點，並讓我找到真正問題的原因。

爲了解決額外的引號的一代，我不得不輸出標記爲html_safe問題：

<td<%= ((index == @project.active_pattern_index) ? ' class="wibble"' : '').html_safe %>> 
    <%= pattern.row(count).instruction %> 
</td>

來源

2016-12-05 David

在td標籤的class應wibble（而不是'wibble'）。

你不應該使用單引號類屬性類中：''

<table id="project-table" class="table table-hover"> 
    <thead> 
    <tr> 
     <th>Row</th> 
     <th>Fubar</th> 
    </tr> 
    </thead> 

    <tbody> 
    <tr class="clickable-row cheese"> 
     <td>Row 1</td> 
     <td class="wibble">Hello World</td> 
    </tr> 
    </tbody> 
</table>

來源

2016-12-05 11:29:52 Dekel

OMG ......臉上的手掌......現在我很尷尬...... TY爲額外的一雙眼睛，在這種情況下，我需要他們......我要再來一杯咖啡：D。雖然這很奇怪......不知道那些雙引號來自哪裏......我在做'><％= pattern.row（count）.instruction％>'。但是不要介意我會弄清楚......你讓我走上了正確的軌道。再次感謝！ – David

當然:)不客氣。 – Dekel

確定不再生成雙引號...必須將輸出標記爲html_safe，現在它可以工作。 – David

覆蓋<tr>造型爲​​使用sass

回答

相關問題

覆蓋<tr>造型爲使用sass