介绍
srczh.css是一款快速轻量、高可扩展的前端框架，体积小巧但主功能完善，更适合入门或准程序员学习使用。
本编所有样式全部css单独效果，用到js效果请到srczh.js文档介绍中查看。
前端示例
前往
css定义一览
| 栅格 |
| 行 | sg-row | | 列 | sh-col | |
| sg-* | 1~10 | | sh-* | 1~10 |
| sgr-* | 1~10 | | nh-* | 2~20 |
| lg-* | 1~9 | | ph-* | 2~20 |
| rg-* | 1~9 | | | |
| ng-* | 1~10 | | | |
| pg-* | 2~20 | | | |
| 字号 |
| 正文 | fs-* | a | 14px |
| | b | 13px |
| | c | 15px |
| 标题 | fsb-* | a | 17px |
| | b | 19px |
| 边框 |
| 大小 | bd-* | 0 | 虚线1px |
| | 1 | 实线1px |
| | 2 | 实线2px |
| | 3 | 实线3px |
| | 4 | 实线4px |
| | 5 | 实线5px |
| 颜色 | bd-* | a | 主色 |
| | b | 激活 |
| | c | 失效 |
| bdp-* | a | 成功 |
| | b | 警告 |
| | c | 异常 |
| | d | 等待 |
| | f | 指针 |
| 布局排列 |
| 水平方向 | fx-* | a | 从左 |
| | b | 在中间 |
| | c | 从右 |
| 垂直方向 | fy-* | a | 居上 |
| | b | 下标对其 |
| | ib | 居中 |
| | c | 居下 |
| 水平位置 | wz-* | a | 居左 |
| | b | 居中 |
| | c | 居右 |
| 边距 | mg-* | 0~5,10,15,20,25 | margin |
| mgl-* | | margin-left |
| mgt-* | | margin-top |
| mgr-* | | margin-right |
| mgd-* | | margin-bottom |
| cmg-* | | >*（内部元素） |
| 间隙 | pd-* | 0~5,10,15,20,25 | padding |
| pdl-* | | padding-left |
| pdt-* | | padding-top |
| pdr-* | | padding-right |
| pdd-* | | padding-bottom |
| cpd-* | | >*（内部元素） |
| 尺寸 | w* | 0~10 | width:0~10px |
| w-* | 10~100 | width:10~10% |
| h* | 0~10 | height:0~10px |
| h-* | 10~100 | height:10~100% |
| 超出 | ov- | a | 总显示 |
| | b | 总隐藏 |
| | c | 滚动 |
| | d | 超出省略 |
| 表单 |
| 输入框 | inp-* | 1 | 小尺寸 |
| | 2 | 中等 |
| | 3 | 大尺寸 |
| 单选按钮 | rd-* | 1 | 小尺寸 |
| | 2 | 大尺寸 |
| 多选按钮 | ck-* | 1 | 小尺寸 |
| | 2 | 大尺寸 |
| 滑动开关 | swh-* | 1 | 小尺寸 |
| | 2 | 大尺寸 |
| 表单样式 | fm-* | a | 多列 |
| | b | 单列 |
| 颜色 |
| 字体色 | cr-* | a | #343434 |
| | b | #6c757d |
| | c | #9a9a9a |
| | d | #c6c6c6 |
| | e | #000000 |
| | f | #ffffff |
| 辅助字体色 | crp-* | a | #5cb65f |
| | b | #ffa117 |
| | c | #e15858 |
| | d | #1666a1 |
| | e | #17a2b8 |
| 背景色 | bk-* | a | #ffffff |
| | b | #f7f7f9 |
| | c | #5a97c3 |
| | d | #7fcde4 |
| | e | #8a8a8a |
| bkp-* | a | #5cb65f |
| | b | #e15858 |
| | c | #ffa117 |
| | d | 渐变色 |
| 被动背景色 | mbk-* | a | #ffffff7a |
| | b | #f7f7f9a1 |
| | c | #5a97c36b |
| | d | #7fcde47d |
| | e | #efefefa6 |
| mbkp-* | a | #5cb65f94 |
| | b | #ffa1176b |
| | c | #e158587a |
| 边框色 | bd-* | a | #ccccc |
| | b | #5a97c3 |
| | c | #eaeaea |
| bdp-* | a | #5cb65f |
| | b | #e15858 |
| | c | #ffa117 |
| | d | #17a2b8 |
| 按钮 |
| 样式 | btn | | 默认 |
| btn-* | a | 小圆角 |
| | b | 中圆角 |
| | c | 大圆角 |
| | d | 圆形 |
| 大小 | btn-* | 1 | 小尺寸 |
| | 2 | 中尺寸 |
| | 3 | 大尺寸 |
| 表示类 | btn-* | pr | 主要 |
| | if | 次要 |
| | da | 失效 |
| | si | 高级 |
| | se | 成功 |
| | wn | 警告 |
| | er | 错误 |
| 按钮组 | btn-z | | |
| 分页按钮 | btn-p | | |
| 手势 | cu-a | | 链接手势 |
| cu-b | | 移动 |
| cu-c | | 等待 |
| cu-d | | 帮助 |
| cu-e | | 禁止 |
| 列表 |
| 样式 | lst | | 默认 |
| lst-* | a | 下虚线 |
| | b | 带边距 |
| | c | 带边框 |
| | z | 堆叠图像 |
| 标志 |
| 样式 | sig-* | 1 | 状态标识点 |
| | 2 | 数量色块 |
| | 3 | 排名图标 |
| | img | 图标状态点 |
| | vs | 版本日志标识 |
| 标签页 |
| 样式 | tab-* | a | 普通 |
| | b | 线条 |
| | c | 竖状 |
| | m | 小按钮 |
| 方位 | tab-x-* | r | 右边 |
| | d | 底部 |
| 菜单 |
| 样式 | mu-* | a | 普通 |
| | b | 下划线 |
| | c | 竖状 |
| | r | 右键 |
| | z | 组合 |
更新日志
2.8
2021-08
- srczh.sig增加sig-vs
- 修正srczh.data展示表现样式
- 修正srczh.menu展示表现样式
- 修正srczh.layer的alert展示表现样式
2.5
2021-05
- 调整srczh.tab的部分样式
- 修改srczh.table部分功能以及滚动效果
- 修改表单提示反馈提示问题
- 修该颜色及颜色辅助
软件著作权
公司申请著作权
srczh.com
srczh.jar
srczh.js
srczh.css
srczh.ide
srczh.db
srczh.dw
srczh.run