样式类名

概述

样式类名是指将常用的css样式通过className进行配置，在使用的时候只需在对应元素上使用className即可显示对应的样式，无需在style中自己定义。比如：

// 预先定义
.fs_12 {
    font-size: 12px;
}

在html中使用

<div class="fs_12">
    12px的字体大小
</div>

优点

1. 样式类名的使用可以减少style样式的创建，从而减少整体代码量。
2. 可以统一团队样式风格，磨平不同项目风格差异。
3. 提高ui界面开发效率

使用

直接在项目中引入样式文件即可

cdn方式

<link rel="stylesheet" type="text/css" href="https://file.40017.cn/tcservice/saas/cdn/classStyle/v0.0.1/classStyle.0.0.1.css"></link>

npm方式

npm i @tcwl/class-style

import '@tcwl/class-style/lib/index.css'

1.1.0

新增输入框类名t-input
新增文本域类名t-textarea
新增卡片类名t-card
新增按钮类名t-button

1.0.1

新增省略类名 .ellisis
新增层级类名 .z-index
新增偏移类名 .translate
新增黑/白色颜色阶梯 .black_1;.black_2;.black_3...
新增鼠标样式类名 .cursor
新增深色模式切换

1.0.0

发布正式版本

0.0.1

发布测试