Skip to main content

absolute-center

插件名#

absolute-center

安装#

npm install @jswork/styled-plugin-absolute-center

参数#

名称类型description
valuestring是否为水平/垂直居中(x/y/xy)

绝对居中的一种实现方式。

原理#

note
  1. margin: auto
  2. 上/下/左/右 均为 0
  3. 适用于被居中的元素，自身是有 width/height 的

用法#

仅 X 方向居中

<View plugin="absolute-center:x">  <div style={{width: 200, height: 400}}>我是要被居中的 element</div></View>

仅 Y 方向居中

<View plugin="absolute-center:y">  <div style={{width: 200, height: 400}}>我是要被居中的 element</div></View>

XY 方向居中

<View plugin="absolute-center:xy">  <div style={{width: 200, height: 400}}>我是要被居中的 element</div></View>

演示#

Live Editor
Result
SyntaxError: Unexpected token (1:8)
1 : return ()
            ^