修改Firefox中Ctrl+左键选中表格单元格的蓝色选中样式

Firefox中按住Ctrl键选中表格单元格时的蓝色样式，是通过**::-moz-cellselection**这个Firefox专属的CSS伪元素控制的，你可以直接用它来修改样式：

/* 自定义Ctrl选中单元格的样式 */
td::-moz-cellselection {
  background-color: #ffcc00; /* 替换为你需要的背景色 */
  border: 1px solid #ff6600; /* 可选：自定义边框样式 */
  color: #333; /* 可选：修改选中单元格内的文字颜色 */
}

结合你提供的示例，完整代码如下：

<style>
    td:focus { /* 可编辑单元格点击聚焦时的样式 */
        outline: dashed;
    }
    ::selection { /* 文本选中时的样式 */
        background: red;
    }
    /* 新增：Ctrl选中单元格的样式 */
    td::-moz-cellselection {
        background-color: #ffcc00;
        border: 1px solid #ff6600;
    }
</style>

<table>
  <tr>
    <td>A</td>
    <td>B</td>
  </tr>
  <tr>
    <td contenteditable="true">C</td>
    <td contenteditable="true">D</td>
  </tr>
</table>

注意事项 #

• ::-moz-cellselection是Firefox独有的伪元素，仅在Firefox中生效，其他浏览器的单元格选中逻辑通常复用::selection的样式。
• 你可以根据需求自由调整background-color、border、color等属性，完全覆盖默认的蓝色样式。

内容的提问来源于stack exchange，提问作者Hans Müller