我想多了解positioning
做了下面的小实验
http://jsbin.com/cevukote/1/edit?html,css,console,output
body里面包了一个d1方块
<body id="bdy">
<div id="d1"> 100px x 100px
position defaul static
用outline描边
最初状态
bdy height = d1.height
bdy width = screen width
1.
为何最初状态
d1 (d1.left, d1.top) = (8,8)?
2.
d1加入
margin-left: 20px;
margin-top: 20px;
d1 (d1.left, d1.top) = (28,20)?
bdy (bdy.left, bdy.top) = (8,20)?
a.(28,20)这两个数字怎么出现的?
b.为何bdy也跟着下移了20px?
c.此处margin改变应该是相对于父元素(bdy)
为何只有d1.left相对于bdy移动了20px
d1.top却没有改变?
感谢
ps1.
其实我乱试了很多 也有很多奇怪的问题
也许从这个最基本的下手我能慢慢厘清
ps2.
使用bootstrap真的很方便
container / nav bar等等都帮我做好了
顶多开一个自己的project.css去设定一些小参数即可
例如将navbar加了一个btn
我再设定一下margin-left/right就可以标出我视觉上大概要的位置
但是当我自己从scratch开始 却觉得那些定义非常混乱