[ReactNative]flex布局对齐的排列属性

2018年01月06日 APP 暂无评论 阅读529次


拥有很少css经验的对于ReactNative的flex布局中alignItems、justifyContent、alignSelf的理解经常会混淆。


下面是个人总结的文字信息以及网上的图片解说。


alignItems enum('flex-start', 'flex-end', 'center', 'stretch') 
子元素在次轴上的排列(此样式设置在父元素上)
align-items.png


justifyContent enum('flex-start', 'flex-end', 'center', 'space-between', 'space-around') 
子元素在主轴上的排列方式(此样式设置在父元素上)
justity-content.png


alignSelf enum('auto', 'flex-start', 'flex-end', 'center', 'stretch') 
子元素在次轴方向的排列方式(此样式设置在子元素上),其值会覆盖父元素的alignItems的值。


网上关于alignContent的解说图,但ReactNative好像没有这属性呢。
align-content.png

分享本文至:

WRITTEN BY

avatar
本文标签:ReactNativeflex
看了本文是不是觉得很赞,那就赶紧点击下面按钮分享给身边的朋友吧!

欢迎留言




用户登录

sitemap