el-table-column type="selection"设置背景色及边框颜色

你可以通过设置 CSS 样式来改变 el-table-column 的背景色和边框颜色。以下是一个示例：

<el-table>
  <el-table-column type="selection" class-name="my-selection-column"></el-table-column>
  <!-- 其他列 -->
</el-table>

<style>
  .my-selection-column {
    background-color: #f0f0f0;
    border: 1px solid #ccc;
  }
</style>

在这个示例中，我们给 el-table-column 加上了一个 class 名称 `my-selection-column`，并且在样式表中设置了其背景色和边框颜色。你可以根据自己的需要来调整样式。

相关问题

<el-table :data="tableData" stripe size="medium" @selection-change="handleSelectionChange"> <el-table-column type="selection" width="55"></el-table-column> <el-table-column prop="id" label="ID" width="80" sortable></el-table-column> <el-table-column prop="goodName" label="图书名称"></el-table-column> <el-table-column prop="price" label="图书单价"></el-table-column> <el-table-column prop="num" label="图书数量"></el-table-column> <el-table-column prop="img" label="图片"> <template v-slot="scope"> <el-image :src="scope.row.img" style="width: 100px; height: 100px"></el-image> </template> </el-table-column> 添加注释

这是一个使用了 Element UI 中的 el-table 组件展示数据的代码片段，其中：

- data 属性绑定了一个名为 tableData 的数组，用于存储要展示的数据。
- stripe 属性设置为 true，表示表格显示斑马线样式。
- size 属性设置为 medium，表示表格大小为中等。
- @selection-change 事件绑定了一个名为 handleSelectionChange 的方法，用于处理表格中选中行的变化。
- el-table-column 组件用于定义表格的列，其中 type="selection" 表示该列为复选框列，prop 属性指定了该列对应数据对象的属性名，label 属性指定了该列的表头名称，width 属性设置了该列的宽度，sortable 属性设置为 true，表示该列可以排序。
- 在第四列中，添加了一个插槽（slot），用于自定义该列的内容。在该插槽中，使用了 el-image 组件展示了图片。通过 scope.row.img 获取了该行数据对象中 img 属性的值，并将其作为 el-image 组件的 src 属性值。

禁用el-table-column type="selection"表头

要禁用 `el-table-column` 的选择框，可以在 `el-table-column` 标签中添加 `selectable` 属性，并将其设置为 `false`，如下所示：

<el-table-column
  type="selection"
  label="选择"
  selectable="false">
</el-table-column>

这将禁用 `el-table-column` 的选择框，但仍然保留表头。如果您还要去掉表头，可以在表格组件中设置 `show-header` 属性为 `false`，如下所示：

<el-table
  :data="tableData"
  show-header="false">
  <el-table-column
    type="selection"
    label="选择"
    selectable="false">
  </el-table-column>
  <!-- 其他列 -->
</el-table>

这将完全隐藏表头和选择框。