【TDesign】怎样修改CSS变量

Tdesign的组件想通过style界说样式没结果, 可以通过组件api文档修改,
组件提供了下列 CSS 变量，可用于自界说样式。
比如Cell, https://tdesign.tencent.com/miniprogram/components/cell?tab=api
提供了：
–td-cell-left-icon-color 图标颜色
–td-cell-title-color 标题笔墨颜色
等等。

如果想通过style给t-cell组件增长样式是没有结果的, 必要修改组件的css变量

1. page {
2.   --td-cell-left-icon-color:#000;
3.   --td-cell-title-color:#000;
4. }

复制代码

包罗在page里的组件可以如许修改
有些组件大概不会被包裹在 page 里，比如自界说 tab-bar。
此时，可以通过给组件增长 class 来实现：

1. <t-tab-bar class="custom-tab-bar">
2.   <t-tab-bar-item value="home" icon="home">home</t-tab-bar-item>
3. </t-tab-bar>

复制代码

对应的 CSS 可以这么界说：

1. .custom-tab-bar {
2.   --td-tab-bar-item-color: red;
3. }

复制代码