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变量
page {--td-cell-left-icon-color:#000;--td-cell-title-color:#000;
}
包含在page里的组件可以这样修改
有些组件可能不会被包裹在 page 里,比如自定义 tab-bar。
此时,可以通过给组件增加 class 来实现:
<t-tab-bar class="custom-tab-bar"><t-tab-bar-item value="home" icon="home">home</t-tab-bar-item>
</t-tab-bar>
对应的 CSS 可以这么定义:
.custom-tab-bar {--td-tab-bar-item-color: red;
}