NZ-Table 滚动条样式定制指南 - 如何修改向右滚动条

要改变 nz-table 中向右滚动条的样式，可以使用以下步骤：

1. 在组件的样式文件中，添加一个类或选择器来定位到 nz-table 的滚动条。例如，可以使用以下选择器：

::ng-deep .ant-table-body::-webkit-scrollbar {
  /* 修改滚动条的样式 */
}

2. 在选择器中，可以使用各种 CSS 属性来修改滚动条的样式。以下是一些常用的 CSS 属性：

• width：设置滚动条的宽度。
• height：设置滚动条的高度。
• background-color：设置滚动条的背景颜色。
• border-radius：设置滚动条的边框半径。
• cursor：设置鼠标悬停在滚动条上时的样式。

3. 在选择器中，可以使用伪类选择器来定位到滚动条的各个部分，例如滑块、轨道等。以下是一些常用的伪类选择器：

• ::-webkit-scrollbar-thumb：滚动条的滑块部分。
• ::-webkit-scrollbar-track：滚动条的轨道部分。

4. 根据需求，可以为滚动条的各个部分设置不同的样式。例如，可以使用以下代码为滑块部分设置红色背景颜色：

::ng-deep .ant-table-body::-webkit-scrollbar-thumb {
  background-color: red;
}

5. 最后，将样式文件引入到组件中，以应用修改的样式。

请注意，使用 ::ng-deep 选择器是为了越过 Angular 的样式封装，直接操作组件内部的样式。但是，这是一种不推荐的做法，因为它可能导致样式的全局应用。更好的做法是使用组件的自定义样式 API 来修改滚动条的样式。