CSS 五种布局方式

一、浮动布局




    
    浮动布局
    



    
浮动布局

浮动布局的兼容性比较好,但是浮动带来的影响比较多,页面宽度不够的时候会影响布局。

二、绝对定位布局




    
    绝对定位布局
    



    
绝对定位布局

绝对定位布局快捷,但是有效性比较差,因为脱离了文档流。

三、flex布局




    
    flex布局
    



    
flex布局

自适应好,高度能够自动撑开

四、table-cell表格布局




    
    table-cell表格布局
    



    
表格布局

兼容性好,但是有时候不能固定高度,因为会被内容撑高。

五、网格布局




    
    网格布局
    



    
网格布局

比较新的一种布局方式,兼容性没那么好。

转自:https://blog.csdn.net/m0_38134431/article/details/84372226

你可能感兴趣的:(css)