标签:div sla margin otto relative justify center form osi
.content{ //父元素 width: 200px; height: 200px; border: 2px solid gainsboro; position: relative; } .box{//子元素 width: 50px; height: 50px; position: absolute; border: 2px solid salmon; float: left; //子元素进行浮动 top: 50%; left: 50%; transform: translate(-50%,-50%); }
.box{//子元素 父元素进行绝对定位 width: 50px; height: 50px; position: absolute; border: 2px solid salmon; float: left; left: 0; right: 0; top: 0; bottom: 0; margin: auto; }
.content{ //对父元素使用 width: 200px; height: 200px; border: 2px solid gainsboro; display: flex; justify-content: center; align-items: center; }
.content{ //对父元素使用 width: 200px; height: 200px; border: 2px solid gainsboro; display: table-cell; vertical-align:middle; } .box{ width: 50px; height: 50px; border: 2px solid salmon; margin:auto; }
标签:div sla margin otto relative justify center form osi
原文地址:https://www.cnblogs.com/kbinblog/p/10914250.html