Vue uni app學習(七) Flex布局

2022-01-31 14:38:24 字數 1582 閱讀 7511

一、容器屬性

display:flex

flex-direction:

取值:row(預設) | row-reverse | column | column-reverse

flex-wrap:

取值:nowrap(預設) | wrap | wrap-reverse

flex-flow:

flex-flow屬性是flex-deriction與flex-wrap屬性的簡寫集合,預設屬性為row nowrap,即橫向排列,且不換行,如果需要控制專案排列與換行,推薦使用此屬性,而非單獨寫兩個。

justify-content:

取值:flex-start(預設) | flex-end | center | space-between | space-around | space-evenly;

用於控制專案在橫軸的對齊方式,預設flex-start即左對齊,center 為居中,對應的flex-end為右對齊。

align-items:

取值:flex-start | flex-end | center | baseline | stretch(預設)

用於控制專案在縱軸排列方式,預設stretch即如果專案沒設定高度,或高度為auto,則佔滿整個容器

align-content:

取值:flex-start | flex-end | center | space-between | space-around | space-evenly | stretch(預設);

用於控制多行專案的對齊方式,如果專案只有一行則不會起作用;預設stretch,即在專案沒設定高度,或高度為auto情況下讓專案填滿整個容器,與align-items類似

二、專案屬性

order:

取值:預設0,用於決定專案排列順序,數值越小,專案排列越靠前。

flex-grow:

取值:預設0,用於決定專案在有剩餘空間的情況下是否放大,預設不放大;注意,即便設定了固定寬度,也會放大。

假設預設三個專案中前兩個個專案都是0,最後乙個是1,最後的專案會沾滿剩餘所有空間。

flex-shrink:

但如果某個專案flex-shrink設定為0,則即便空間不夠,自身也不縮小。

flex-basis:

取值:預設auto,用於設定專案寬度,預設auto時,專案會保持預設寬度,或者以width為自身的寬度,但如果設定了flex-basis,權重會width屬性高,因此會覆蓋widtn屬性。

flex:

取值:預設0 1 auto,flex屬性是flex-grow,flex-shrink與flex-basis三個屬性的簡寫,用於定義專案放大,縮小與寬度。

該屬性有兩個快捷鍵值,分別是auto(1 1 auto)等分放大縮小,與none(0 0 auto)不放大,但等分縮小。

align-self:

取值:auto(預設) | flex-start | flex-end | center | baseline | stretch,表示繼承父容器的align-items屬性。如果沒父元素,則預設stretch。

用於讓個別專案擁有與其它專案不同的對齊方式,各值的表現與父容器的align-items屬性完全一致。

深度學習七

我看到過的最複雜的模型就是ssd了,應該說在object detection這個領域,大牛們都是一再的奮鬥著 努力著。一路飄過,聽到的模型真的有很多,但是我覺得有質的變化還應該是r cnn spp fast rcnn faster rcnn yolo,為什麼會是這樣呢,我感覺其實如果是但一物體的識別...

出差 七 學習

第七天,隨著時間的推進,感覺風險也在加劇,進入最煎熬的階段。今天早晨跟大家一起晨會,將當前的工作做個梳理,排出下個階段的工作時間表。內部計畫在本月15日完成全面部署,開發完成時間最晚要在14日前完成,由於專案的進度問題,老闆也臨時更改了我的行程安排,由原先的乙個星期改到至少還要延期半個月,這還是樂觀...

Mogre學習筆記(七)

section 7 skeleton animation今天試圖新增多個模型的骨骼動畫,出了一些問題,鬱悶了一上午之後終於找到了問題所在,下面我們就首先給出tutorial上的一段 看看如何使用骨骼動畫,再說說我遇到的問題吧n n using system using system.drawing ...