Re: [問題] css positioning

作者: fire231 (Bloodmors)   2014-07-07 20:37:11
※ 引述《sean72 (.)》之銘言:
: 我想多了解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)?
因為你的 bdy 不知道為什麼自帶有 margin 8px
所以位置就不會是 0 0
你可以設定 margin 0px就知道了
: 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卻沒有改變?
: 感謝
我不知道你怎麼加入的
總之我加入是沒這個問題
http://jsbin.com/cevukote/4/edit
作者: hit1205 (幫你把勇氣裝滿)   2014-07-07 21:52:00
那個 8px 其實是瀏覽器的內建樣式 XD
作者: mmis1000 (秋月戀楓)   2014-07-07 23:32:00
這就是為啥有cssreset這種東西,不加的話常被內建樣式整

Links booklink

Contact Us: admin [ a t ] ucptt.com