站長資訊網
        最全最豐富的資訊網站

        flex布局的優缺點是什么

        flex布局的優缺點是:1、flex布局優點在于其容易上手,根據flex規則很容易達到某個布局效果;2、缺點是瀏覽器兼容性比較差,只能兼容到ie9及以上。

        flex布局的優缺點是什么

        本文操作環境:Windows7系統,css3版本,Dell G3電腦。

        推薦:css視頻教程

        flex布局的優缺點是:

        CSS3 彈性盒( Flexible Box 或 flexbox),是一種當頁面需要適應不同的屏幕大小以及設備類型時確保元素擁有恰當的行為的布局方式。

        引入彈性盒布局模型的目的是提供一種更加有效的方式來對一個容器中的子元素進行排列、對齊和分配空白空間。

        css3引入的flex布局優缺點:

        • 優點在于其容易上手,根據flex規則很容易達到某個布局效果。

        • 缺點是:瀏覽器兼容性比較差,只能兼容到ie9及以上。

        css3引入的flex布局介紹:

        彈性盒子由彈性容器(Flex container)和彈性子元素(Flex item)組成。彈性容器通過設置 display 屬性的值為 flex 或 inline-flex將其定義為彈性容器。彈性容器內包含了一個或多個彈性子元素。

        注意: 彈性容器外及彈性子元素內是正常渲染的。彈性盒子只定義了彈性子元素如何在彈性容器內布局。彈性子元素通常在彈性盒子內一行顯示。默認情況每個容器只有一行。

        示例:

        <!DOCTYPE html> <html> <head> <meta charset="utf-8">  <title>php中文網</title>  <style>  .flex-container {     display: -webkit-flex;     display: flex;     width: 400px;     height: 250px;     background-color: lightgrey; } .flex-item {     background-color: cornflowerblue;     width: 100px;     height: 100px;     margin: 10px; } </style> </head> <body> <div class="flex-container">   <div class="flex-item">flex item 1</div>   <div class="flex-item">flex item 2</div>   <div class="flex-item">flex item 3</div>   </div> </body> </html>

        效果如下:

        flex布局的優缺點是什么

        贊(0)
        分享到: 更多 (0)
        網站地圖   滬ICP備18035694號-2    滬公網安備31011702889846號
        主站蜘蛛池模板: 国产精品爱啪在线线免费观看| 国产精品粉嫩美女在线观看| 欧美精品手机在线播放| 日韩三级精品| 97精品在线播放| 国内精品久久久久久99| 日本一区二区三区精品国产 | 成人精品一区二区久久久| 漂亮人妻被黑人久久精品| 久久精品国产亚洲精品| 91亚洲国产成人久久精品| 国产精品视频一区二区三区经 | 3级黄性日本午夜精品| 国产乱人伦偷精品视频AAA| 亚洲精品无码久久一线| 欧美XXXX黑人又粗又长精品| 国产精品 综合 第五页| 2022年国产精品久久久久| 精品一区二区三区在线成人| 亚洲国产精品无码久久一区二区| 久久性精品| 精品一区二区三区高清免费观看| 91精品国产高清久久久久久国产嫩草| 国产91精品一区二区麻豆网站| 久久精品www人人爽人人| 亚洲国产精品无码久久98| 亚洲精品A在线观看| 亚洲国产精品自产在线播放| 亚欧乱色国产精品免费视频| 欧美精品黑人粗大欧| 欧美日韩国产中文精品字幕自在自线 | 国产午夜精品理论片久久影视| 99精品免费视频| 99re国产精品视频首页| 精品国产第1页| 久久国产精品久久国产精品| 99精品国产一区二区三区2021| 99re66热这里只有精品| 久久精品国产99国产电影网| 久久青青草原精品影院| 日韩精品一区二区三区四区|