CSS水平垂直居中的六种方法!

一,已知宽度居中;

二,未知宽度居中;

三,平移定位居中;

四,平移不定位居中;

五,flex布局居中;

六,table-call布局居中;

详细代码如下所示:




    
    
    CSS水平垂直居中的六种方法



    
已知宽度居中
未知宽度居中
translate定位居中
translate不定位居中
flex布局居中
table居中

 

效果如下图:

滚动截屏的图片效果有点偏移,实际效果正常。

 

CSS水平垂直居中的六种方法!_第1张图片

你可能感兴趣的:(笔记)