Question

我目前正在开发一个rails应用程序，我想要突出显示一个背景颜色的行，但除此之外，在该行中突出显示一个具有不同颜色的数据单元格。

我遇到的问题是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>

sass

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

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

我做错了什么？

ps：使用bootstrap 3，但我认为这与此问题无关，是吗？

更新[已解决]

好吧，看来我是在失明，并没有意识到为class="'wibble'"生成了一组额外的双引号 - 感谢@Dekel迅速指出这一点，并允许我找到真正问题的原因。

要解决生成额外引号的问题，我必须将输出标记为html_safe：

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

覆盖使用sass的样式

0 个答案: