如何更改 wiki Fossil (fossil-scm) 中单元格的背景颜色？

Posted 2023-02-19

【中文标题】如何更改 wiki Fossil (fossil-scm) 中单元格的背景颜色？

【英文标题】：How can I change the background color of a cell in a wiki Fossil (fossil-scm)?

【发布时间】：2020-01-29 19:53:44

【问题描述】：

这样静态设置颜色：

<table>
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td bgcolor="#FF0000">January</td>
    <td bgcolor="#00FF00">$100</td>
  </tr>
</table>

但是如何动态更改单元格的背景颜色，例如，当您将鼠标悬停在表格下方的文本上时？

【参考方案1】：

欢迎来到 SO :)

这更像是一个CSS 问题而不是化石问题。

要更改悬停时单元格（或任何其他元素）的背景颜色，您可以使用以下内容：

<style>
 td.hovercolour 
   background-color: #00FF00;
 
 td.hovercolour:hover 
   background-color: yellow;
 
</style>
<table>
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td bgcolor="#FF0000">January</td>
    <td class="hovercolour">$100</td>
  </tr>
</table>

请注意，要使 CSS 正常工作，表格单元格已被赋予一个类，而不是硬编码的颜色值。该类只是为了说明而称为“hovercolor”，它可以是任何东西，只要它以字母开头。对于任何具有类的元素，浏览器都会期望该类的样式声明。此示例中的声明告诉浏览器使用'psuedo-selector' 在悬停时更改样式（背景颜色）。如果您需要对鼠标悬停/等进行任何花哨的操作，CSS 选择器/伪选择器可能会在您需要求助于 javascript 之前帮助您完成大部分工作。

在本例中，样式表是内联的。如果您想在化石的多个页面上使用相同的样式/CSS，而无需大量复制和粘贴，则需要通过复制您当前使用的皮肤来创建新皮肤（这将减少头痛而不是仅仅编辑当前皮肤），然后在皮肤的 CSS 页面上添加您的样式声明，并将您的 CSS 类/ID 添加到您的 wiki 页面中的 html 元素或通过编辑相关页面的模板（例如，在管理面板）。

使用 Web 界面编辑和起草你的皮肤很容易/完全没有痛苦，但是如果你更喜欢桌面 IDE，那么在 Fossil 的网站上有一些关于使用文件而不是 Web 界面进行起草的注意事项（“建议的皮肤定制程序”在'Theming' 页面的底部）。

【讨论】：

非常感谢。很抱歉，我无法标记 +1。