說到讓一個div水準居中,立馬想到最常用的就是margin:0 auto;但是這個的前提是必須知道盒子的寬度,盒子居中主要有兩種情況:
一.确定盒子的寬度,解決辦法有:
1.1 margin:0 auto;
1.2 position:relative;left:50%;margin-left:-0.5*width;(用絕對定位也可以)
二.不确定盒子寬度的,而且盒子寬度可變的,方法如下
2.1 position:relative:left:50%;transform:translateX(-50%);-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);//這裡的50%是指盒子本身的50%;
2.2 width:fit-content;width:-moz-fit-content;width:-webket-fit-content;margin:auto;