GraceUI 内置了 absolute 和 fixed 两种模式的定位样式,您可以使用他们快速实现定位布局;
注意 : nvue 平台无法设置 z-index 属性,最后出现的定位元素层级最高。
H5 | APP | 小程序 | NVUE |
✔ | ✔ | ✔ | ✔ |
属性名称 | 样式值 | 作用 |
.gui-relative | position:relative; | 声明 view position:relative,一般用于 absolute 元素的父级元素。 |
.gui-absolute-lt | position:absolute; z-index:2; left:0; top:0; | absolute 左上 |
.gui-absolute-rt | position:absolute; z-index:2; right:0; top:0; | absolute 右上 |
.gui-absolute-lb | position:absolute; z-index:2; left:0; bottom:0; | absolute 左下 |
.gui-absolute-rb | position:absolute; z-index:2; right:0; bottom:0; | absolute 右下 |
.gui-fixed-lt | position:fixed; z-index:2; left:0; top:0; | fixed 左上 |
.gui-fixed-rt | position:fixed; z-index:2; right:0; top:0; | fixed 右上 |
.gui-fixed-lb | position:fixed; z-index:2; left:0; bottom:0; | fixed 左下 |
.gui-fixed-rb | position:fixed; z-index:2; right:0; bottom:0; | fixed 右下 |