gpt4 book ai didi

html - 使用 sass 覆盖 的 样式

转载 作者:太空宇宙 更新时间:2023-11-04 02:04:57 29 4
gpt4 key购买 nike

我目前正在开发一个 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>

最佳答案

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>

关于html - 使用 sass 覆盖 <td> 的 <tr> 样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40973155/

29 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com