布局基礎(chǔ)

默認(rèn)每個(gè)View進(jìn)行垂直布局。每個(gè)view占據(jù)一行。

flex布局（設(shè)置display=flex）

         平面布局有一個(gè)主軸和交叉軸（類(lèi)似于平面坐標(biāo)中的X軸和 Y軸）

         默認(rèn)X軸為主軸 Y軸為交叉軸

         flex容器屬性：針對(duì)于容器內(nèi)的容器

                   flex-direction排列方向

                            row(默認(rèn))         column

                   flex-wrap元素?fù)Q行問(wèn)題

                            nowrap（不換行）         wrap(換行)

                            wrap-reverse換行反轉(zhuǎn)（多的一行在上面）

                   flex-flow上面兩個(gè)的簡(jiǎn)寫(xiě)

                            先定義方向  再定義換行

                   justify-content主軸的對(duì)齊元素

                            center(沿主軸居中對(duì)齊)

                            flex-start（主軸左邊、默認(rèn)方式）      flex-end（主軸右邊）

                            space-around（各個(gè)元素平分主軸空間）

                            space-between元素兩端對(duì)齊 中間間隔相同

                   align-items交叉軸的對(duì)齊方式

                            flex-start  flex-end

                            center

                            stretch（在元素沒(méi)有設(shè)置高度時(shí)，占滿(mǎn)整個(gè)容器的高度）

                            baseline以元素中的文字的底線(xiàn)進(jìn)行對(duì)齊

         flex元素屬性 針對(duì)于容器內(nèi)的元素

                   flex-grow有多余空間時(shí)，元素的放大比例

                            設(shè)置多個(gè)元素之間的比例，按照比例瓜分剩余空間

                   flex-shrink空間不足時(shí)，元素的縮小比例

                            默認(rèn)為1，表示空間不足時(shí)，所有元素等比縮小

                            某元素設(shè)置為0時(shí)，表示不縮小

                            值越大，縮小比例越大。

                   flex-basis元素在主軸上占據(jù)的空間

                            rpx可能會(huì)不生效

                   flex是上面三者的簡(jiǎn)稱(chēng)

                                     放大 縮小 空間

                   order元素排列順序

                            根據(jù)元素個(gè)數(shù)，數(shù)越小越靠前

                   align-self元素自身的定義方式

                            利于定義某些特殊元素的布局

相對(duì)定位

         相對(duì)于自身進(jìn)行定位，參照物是自己

絕對(duì)定位

是相對(duì)于離它最近的已經(jīng)定位的父級(jí)元素進(jìn)行定位的。

如果所有父級(jí)都沒(méi)有定位，則相對(duì)于整個(gè)窗口定位。