您好,登錄后才能下訂單哦!
這篇文章主要介紹“flex布局屬不屬于css3的”的相關知識,小編通過實際案例向大家展示操作過程,操作方法簡單快捷,實用性強,希望這篇“flex布局屬不屬于css3的”文章能幫助大家解決問題。
flex布局屬于css3;flex是“Flexible Box”的縮寫,意為”彈性布局”,用來為盒狀模型提供最大的靈活性,任何一個容器都可以指定為flex布局,語法為“box{display:flex;}”。
本教程操作環境:windows10系統、CSS3&&HTML5版、Dell G3電腦。
flex布局屬于css3,網頁布局(layout)是CSS的一個重點應用。
2009年,W3C提出了一種新的方案—-Flex布局,可以簡便、完整、響應式地實現各種頁面布局。
一、Flex布局是什么?
Flex是Flexible Box的縮寫,意為”彈性布局”,用來為盒狀模型提供最大的靈活性。
任何一個容器都可以指定為Flex布局。
.box{ display: flex; }
行內元素也可以使用Flex布局。
.box{ display: inline-flex; }
Webkit內核的瀏覽器,必須加上-webkit前綴。
.box{ display: -webkit-flex; /* Safari */ display: flex; }
注意,設為Flex布局以后,子元素的float、clear和vertical-align屬性將失效。
二、基本概念
采用Flex布局的元素,稱為Flex容器(flex container),簡稱”容器”。它的所有子元素自動成為容器成員,稱為Flex項目(flex item),簡稱”項目”。
容器默認存在兩根軸:水平的主軸(main axis)和垂直的交叉軸(cross axis)。主軸的開始位置(與邊框的交叉點)叫做main start,結束位置叫做main end;交叉軸的開始位置叫做cross start,結束位置叫做cross end。
項目默認沿主軸排列。單個項目占據的主軸空間叫做main size,占據的交叉軸空間叫做cross size。
關于“flex布局屬不屬于css3的”的內容就介紹到這里了,感謝大家的閱讀。如果想了解更多行業相關的知識,可以關注億速云行業資訊頻道,小編每天都會為大家更新不同的知識點。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。