CSS居中完全解决方案_html/css_WEB-ITnose

上次面试面试官问到了，问了个定宽局中和不定宽局中，下来我把所有有关CSS居中都总结了一下

div{ width: 150px; height: 150px; position: absolute; top: 50%; left: 50%; margin-top: -75px; margin-left: -75px; } 

已知高度、宽度的元素(flex)

给父级使用flex布局

div{ display: flex; justify-content:center; align-items: center; } 

未知高度、宽度的元素

使用CSS translate

div{ position:absolute; top:50%; left:50%; -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); transform:translate(-50%,-50%); } 

查看更多关于CSS居中完全解决方案_html/css_WEB-ITnose的详细内容...