居中显示

CSS绝对定位技巧

weixin_33887443

于 2017-02-26 20:15:00 发布

阅读量65

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/aixiuxiu/p/6445684.html

本文介绍了一种使用CSS绝对定位的方法，使元素能够居中显示。通过设置特定的position属性及margin值，即使父元素没有明确的高度和宽度，也能实现元素的精确居中。

<div class="box">
<p>高度固定</p>

</div>

不使用margin-top:-100px;

.box{

position:absolute;
background-color: #ccc;

left: 50%;
top: 50%;
width:200px;
height:100px;
margin-left:-100px;
margin-top:-50px;
overflow: hidden;

}

要使用绝对定位，相对定位下百分比不起作用。

转载于:https://www.cnblogs.com/aixiuxiu/p/6445684.html

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。