为了账号安全,请及时绑定邮箱和手机立即绑定

关于position:relative left:50%的问题?

代码:

<style>

#div1{  

 width:200px;    

height:200px;

border:2px red solid;

position:relative;    

left:50%;    

top:50%;

}

</style>

</head>

<body>

<div id="div1"></div>

</body>

  1. left:50%这代表什么?为什么是移动body的50%的距离?

  2. 为什么使用top:50%却没有效果?

正在回答

3 回答

  1. 这个以body为参照,就是移动页面宽度的50%

  2. 页面的长度是没有限制的 ,你可以一直滚动页面往下拉,so


0 回复 有任何疑惑可以回复我~
#1

Eason_Mar 提问者

非常感谢!
2016-03-01 回复 有任何疑惑可以回复我~
#2

福尔摩牙

你好,请问关于问题一,意思是不是:比如页面宽度为600px,那么left:50%,是不是意味着这个div会向右移动300px,再加上div本身的200px,后来右边就只有100px的宽度了呢?
2016-03-02 回复 有任何疑惑可以回复我~
#3

未之未央丿 回复 福尔摩牙

是的,就是这样理解的
2016-03-06 回复 有任何疑惑可以回复我~

left:50%代表父级容器的一半宽度。在你这里是body.

在父级div上加一个position:relative,这里用absolute试试?

0 回复 有任何疑惑可以回复我~

div1是放置在body中,所以是移动body的50%

0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

关于position:relative left:50%的问题?

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信