React之Flex

react native 的flex布局,是web的阉割版本,目前还不支持flex-shrink、flex-basis、order几种flex属性,同时现有支持的flex属性值也不全。

alignItems

调整伸缩项目在侧轴上的定位方式

可选值:flex-start,flex-end,center,stretch

alignSelf

alignSelf属性会覆盖容器的alignItems属性,取值和用法alignItems一样。

可选值:auto,flex-start,flex-end,center,stretch

justifyContent

与alignItems相呼应,表示元素在主轴(横轴)方向上的对齐方式

可选值:flex-start,flex-end,center,space-between,space-around

flexDirection

子元素在父容器中的排列位置,相比于web,少了row-reverse和column-reverse两个值

可选值:row,column

flexWrap

子元素超出父容器时是否换行

可选值:wrap,nowrap

本文参考至:

justify-content

flex-direction

flex-flow

flex-wrap

align-content

align-items

Posted inWEB前端技术.Taggedreact,react-native.

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容