样式类
样式类class的创建与使用
本页面中使用的样式和全局所有页面使用的样式
样式的优先级
样式类概述
有时候页面中有很多元素共用相同的样式,我们一个个的去设置需要设置很多次,
而且如果哪天我们想修改这个样式,也要修改很多次,这个时候就需要样式类 class
创建样式类
在可视化设计页面 点击最上方的文档按钮,右边属性窗口-》常规
下面有页面样式 和全局样式的设置
页面样式
只能在当前页面中使用的样式
全局样式
可以在所有页面中使用的样式
我们在页面样式下面表格里面点击新建
我们创建了一个 红色背景外间距10 的样式 bg-red-mg10 样式名称通常用-分割
接着在设计那里把背景改为红色
间距地方改成都是10
然后点击确定
使用样式类
在需要添加样式的控件点击属性 通用 添加样式 如下图
选择刚刚添加的样式bg-red-mg10 点击保存即可
对于样式类上面的样式 设计器显示的页面上不一定可以显示出样式 点击预览 可以在预览状态下看到该样式
预览结果如下:
我们还可以再对样式类进行修改 比如把字体颜色改成绿色 那么再进行预览 字体颜色就变成了绿色
同样 我们还可以创建一个全局样式
绿色字体内间距10 txt-green-pd-10
我们可以在刚才那些组件上再添加这个全局样式
点击预览
其它使用样式类
我们再修建一个页面
选择文档 常规这里 我们是可以看到刚才新建的全局样式 看不到刚才那个页面样式
我们在新建的页面中也可以使用这个全局样式 使用方式和在本页面使用一致
扩展与优先级
一个样式可以被很多个组件使用
一个组件也可以使用多个样式 包括页面样式和全局样式
如果一个组件同时使用了页面样式和全局样式 并且有相同的样式项 比如全局的字体设置的是红色 页面中设置的是绿色
那么页面样式的优先级大于全局样式的 最终显示为绿色





