作者broo (陈爷)
看板Web_Design
标题[问题] position relative问题
时间Sun Nov 27 14:38:23 2016
刚刚在做codecademy的教学,想问的是我刚刚设了一个选择器
内容如下:
.question{
position:relative;
top:240px;
margin:120px auto;
text-align:center;
}
执行结果是这样
http://imgur.com/bvBaHxq
将top改为40px後结果变这样
http://imgur.com/pv4xsyB
怎麽改都只有question1和上面的header距离有产生变化
为何question2 和question1中间都不会有变化呢?
我其他的question也有套用选择器
另外margin跟 relative position 有什麽不同吗?
用一用觉得很像阿..
谢谢各位
下面图片网址点进去有完整程式码
--
※ 发信站: 批踢踢实业坊(ptt.cc), 来自: 49.159.117.170
※ 文章网址: https://webptt.com/cn.aspx?n=bbs/Web_Design/M.1480228706.A.7B7.html
※ 编辑: broo (49.159.117.170), 11/27/2016 15:09:33
2F:推 s89227: margin跟position完全不同… 11/27 15:11
3F:→ s89227: margin可以理解成外留白,position是定位方式 11/27 15:12
4F:→ steven04090: 因为你的每一个question的老爸都是body 11/27 15:24
5F:→ broo: 我现在症结的点是我在选择器里设了left:500px,整排question 11/27 15:33
6F:→ broo: 都会移动,那为何设了top:40px却只有第一个question会动, 11/27 15:33
7F:→ broo: 麻烦你们!! 11/27 15:33
8F:→ steven04090: relative是根据他的父元素产生相对位移 11/27 15:43
9F:→ steven04090: 你的每一个question的父元素不是上一个question而是 11/27 15:43
10F:→ steven04090: body 所以全部都是相对於body来移动 11/27 15:44
11F:→ steven04090: 你把其中一个question 放到另一个question自然会明白 11/27 15:46
12F:→ broo: 原来如此!!!谢谢你们帮了大忙! 11/27 15:52
14F:→ Kenqr: relative不是相对父元素 是相对自己原本的位置 11/27 21:16
15F:→ Kenqr: 大家都往上200px 所以中间的距离不变 11/27 21:17
16F:→ broo: 原来是这样..稍微搞混了一下..谢谢你!! 11/27 22:50
17F:→ steven04090: 抱歉 记成跟绝对定位的一些使用 11/28 08:27