代码改变世界

元素水平垂直居中的四种方式(别人文章)

2018-11-09 10:00  菜兔  阅读(287)  评论(0编辑  收藏  举报

元素水平垂直居中的四种方式

1) 定位方式
position:absolute;
top:50%;
left:50%;
margin-left:(自身宽度的一半);margin-top:-50%value(自身高度的一半)
2) 定位
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
margin:auto;
3) flex的方式
给 容 器 加 :
display:flex ;
justify-content:center ;
align-items:center ;
4) 位移的方式
position:absolute ;
top:50% ;
left:50% ;
transform:translate(-width/2,-height/2) ;


---------------------
作者:爱笑萌娃
来源:CSDN
原文:https://blog.csdn.net/qq_43101321/article/details/82716848
版权声明:本文为博主原创文章,转载请附上博文链接!