StatusBar 状态栏
基础用法
html
<vz-status-bar></vz-status-bar>
固定在顶部
html
<vz-status-bar fixed></vz-status-bar>
背景颜色
html
<vz-status-bar background="var(--vz-color-primary)"></vz-status-bar>
Props
属性名 | 说明 | 类型 | 默认值 |
---|---|---|---|
fixed | 是否固定在顶部 | boolean | false |
z-index | z-index | string / number | --vz-z-index |
background | 背景 | string | --vz-bg-color |
i-class | 根节点样式类 | string | - |
i-style | 根节点样式 | Vue.StyleValue | - |
CSS
变量名 | 说明 | 默认值 |
---|---|---|
--vz-status-bar-z-index | props.zIndex | --vz-z-index |
--vz-status-bar-background | props.background | --vz-bg-color |
SCSS
scss
$status-bar: (
"z-index": var(--vz-z-index),
"background": var(--vz-bg-color-page),
);