1、display
該屬性用來指定元素是否為伸縮容器
flex | inline-flex
flex用於產生塊級伸縮容器
inline-flex用於產生行級伸縮容器
2、flexdirection
該屬性指定主軸方向
row | row-reverse | column | column-reverse
row(預設值),伸縮容器若為水平方向軸，伸縮專案的排版方式從左向右排列
注：flex－direction預設為row，如果容器是橫向伸縮，不用定義
row-reverse伸縮容器若為水平方向，伸縮專案的排版方式為從右到左
column伸縮容器若為垂直方向軸，伸縮專案的排版方式為從上向下排列
column-reverse伸縮容器若為垂直方向軸，伸縮專案的排版方式為從下向上排列
3、flex-wrap
該屬性主要來指定伸縮容器的主軸線方向空間不足的情況下，是否換行以及該如何換行
wrap | nowrap | wrap-reverse.
wrap:伸縮容器空間不足的情況下允許換行。若主軸為水平軸，換行方向為從上到下
wrap-reverse伸縮容器空間不足的情況下允許換行。若主軸為水平軸，換行方向為從下到上
4、flex-flow
該屬性是flex-direction和flex-wrap屬性的縮寫版本，他同時定義了伸縮容器的主軸和側軸，其預設值為row nowrap。
flex-direction flex-wrap
5、justify-content
該屬性來定義伸縮專案沿主軸線的對其方式
:flex-start | flex-end | center | space-between | space-around
flex-start：伸縮專案向主軸線的起始位置靠齊。
flex-end：伸縮專案向主軸線的結束位置靠齊。
center：伸縮專案向主軸線的中間位置靠齊。
space-between：伸縮專案會平均的分布在主軸線裡。第乙個伸縮專案在主軸線的開始位置，最後乙個伸縮專案在主軸線的重點位置。
space-around：伸縮專案會平均的分布在主軸線裡。兩端保留一半的空間。
6、align-items
該屬性用來定義伸縮專案在伸縮容器的交叉軸上的對齊方式，其語法為：
align-items:flex-start | flex-end | center | baseline | stretch
flex-start（預設值）：伸縮專案向交叉軸的起始位置靠齊。
flex-end：伸縮專案向交叉軸的結束位置靠齊。
center：伸縮專案向交叉軸的中間位置靠齊。
baseline：伸縮專案根據它們的基線對齊。
stretch：伸縮專案根據它們的基線對齊。
7、align-content
這個屬性主要用來調整伸縮專案出現換行後在交叉軸上的對齊方式，類似於伸縮專案的主軸上使用justify-content，語法：
align-content: flex-start | flex-end | center | space-between | space-around | stretch
flex-start：伸縮專案向交叉軸的起始位置靠齊。
flex-end：伸縮專案向交叉軸的結束位置靠齊。
space-between：伸縮專案向交叉軸中平均分布。
space-around：伸縮專案向交叉軸中平均分布，且在兩邊各有一班的空間。
stretch(預設值)：伸縮專案將會在交叉軸上伸展以占用剩餘空間。
center：伸縮專案將會向交叉軸的中間位置靠齊。
ReactNative元件匯出
如果對rn開發有一定的了解的話，就會發現，reactnative提供的元件不能完全滿足開發的需求，就需要自定義一些元件，那麼如何匯出全域性的自定義元件呢？元件匯出有兩種形式 開發者一般使用預設元件匯出 首先在專案下面新建乙個資料夾rn design rn design就是乙個自己的元件庫類似於rea...
react native引導畫面元件
rn viewpager ios android react native material design android import from rn viewpager 引入必要依賴元件，其餘元件自行引入 style 必須flex 1 style 自定義右側頭部按鈕 style style 跳過...
React Native 定義元件 簡單
react native 定義元件 簡單 1.首先建立乙個header.js 檔案 2.宣告元件 import react,from react import from react native 3.建立元件的內容class header extends component 4.樣式const st...