介绍

srczh.css是一款快速轻量、高可扩展的前端框架,体积小巧但主功能完善,更适合入门或准程序员学习使用。
本编所有样式全部css单独效果,用到js效果请到srczh.js文档介绍中查看。

前端示例

srczh.css 前往

css定义一览

栅格
sg-rowsh-col
sg-*1~10sh-*1~10
sgr-*1~10nh-*2~20
lg-*1~9ph-*2~20
rg-*1~9
ng-*1~10
pg-*2~20
字号
正文fs-*a14px
b13px
c15px
标题fsb-*a17px
b19px
边框
大小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,25margin
mgl-*margin-left
mgt-*margin-top
mgr-*margin-right
mgd-*margin-bottom
cmg-*>*(内部元素)
间隙pd-*0~5,10,15,20,25padding
pdl-*padding-left
pdt-*padding-top
pdr-*padding-right
pdd-*padding-bottom
cpd-*>*(内部元素)
尺寸w*0~10width:0~10px
w-*10~100width:10~10%
h*0~10height:0~10px
h-*10~100height: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组合
表格
样式tbl-*a普通
b列表
样式tre-*a竖状
b水平

更新日志

2.8

2021-08

  • srczh.sig增加sig-vs
  • 修正srczh.data展示表现样式
  • 修正srczh.menu展示表现样式
  • 修正srczh.layer的alert展示表现样式
2.5

2021-05

  • 调整srczh.tab的部分样式
  • 修改srczh.table部分功能以及滚动效果
  • 修改表单提示反馈提示问题
  • 修该颜色及颜色辅助

软件著作权

公司申请著作权

公司软件著作权

请您对本章评分:
2016 - 2021 © srczh.com 版权所有 增值电信经营许可:粤ICP备19068081号
深圳市中文远星科技有限公司