首页 > 其他 > 详细

让一个小的div在大的div中居中显示

时间:2019-04-22 10:02:45      阅读:281      评论:0      收藏:0      [点我收藏+]

原文

实现原理是设置margin自动适应,然后设置定位的上下左右都为0。

就如四边均衡受力从而实现盒子的居中:

代码:

.parent {
width:800px;
height:500px;
border:2px solid #000;
display:table-cell;
vertical-align:middle;
text-align: center;
}
.child {
width:200px;
height:200px;
display:inline-block;
background-color: red;
}

扩展资料

div+css绝对定位

使用通常是父级定义position:relative定位

子级定义position:absolute绝对定位属性,并且子级使用left或right和top或bottom进行绝对定位。

.divcss5{position:relative} 定义,通常最好再定义CSS宽度和CSS高度
.divcss5-a{position:absolute;left:10px;top:10px} 这里定义了距离父级左侧距离间距为10px,距离父级上边距离为10px
参考资料

百度百科-div css

 

让一个小的div在大的div中居中显示

原文:https://www.cnblogs.com/xiaoshen666/p/10748155.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!