|
（7）給包含塊一個(gè)高度，或者說(shuō)給定位對(duì)象的父級(jí)設(shè)定一個(gè)高度。不然也許顯示的結(jié)果并不是你想要的。在下面的例子中，如果你本意要實(shí)現(xiàn)下面效果：把小盒子在父盒子中的左上角垂直往下偏移，上方留出一塊區(qū)域，如果你刪除了box1的高度會(huì)怎么樣呢？自己測(cè)試一下吧。
運(yùn)行代碼框
[Ctrl+A 全部選擇 提示：你可先修改部分代碼，再按運(yùn)行]
（8）放置絕對(duì)定位對(duì)像到可視區(qū)外會(huì)出現(xiàn)滾動(dòng)條。一般情況下，絕對(duì)定位是用來(lái)方便定位網(wǎng)頁(yè)要看得見(jiàn)元素的，而不是拿它來(lái)隱藏對(duì)象的，一般隱藏對(duì)象常用到display與margin，如果你試圖把絕對(duì)定位的對(duì)象移出可視區(qū)域，嘿嘿，瀏覽器會(huì)為你準(zhǔn)備滾動(dòng)條去看望它。
運(yùn)行代碼框
[Ctrl+A 全部選擇 提示：你可先修改部分代碼，再按運(yùn)行]
（9）放置相對(duì)定位對(duì)像到可視區(qū)外不會(huì)出現(xiàn)滾動(dòng)條。此現(xiàn)象很好理解，因?yàn)橄鄬?duì)定位對(duì)象原來(lái)位置沒(méi)有變，原來(lái)位置沒(méi)有出去滾動(dòng)條就不會(huì)出現(xiàn)。在下面實(shí)例中，如果你縮小瀏覽器窗口，相對(duì)定位的對(duì)象還會(huì)出現(xiàn)完全消失的情況呢。
運(yùn)行代碼框
[Ctrl+A 全部選擇 提示：你可先修改部分代碼，再按運(yùn)行]
（10）定位的特殊值情況。如果定位設(shè)置是這樣的：position:relative ，right:200px， left:10px會(huì)出現(xiàn)什么情況呢？一邊叫對(duì)象向右偏移10px，另一邊又叫對(duì)象向左偏移200px，到底是聽(tīng)那邊的呢，還是那個(gè)先，那個(gè)后呢。針對(duì)這種矛盾情況，CSS規(guī)定只聽(tīng)左邊的left，而右邊怎么設(shè)置都被重定為-left,即-left =right。上下值top與bottom矛盾的話，就以top為準(zhǔn)，所以在下面的實(shí)例中，你如何改變r(jià)ight的值，對(duì)象位置不會(huì)發(fā)生改變的。
運(yùn)行代碼框
[Ctrl+A 全部選擇 提示：你可先修改部分代碼，再按運(yùn)行]
4．綜合實(shí)例見(jiàn)證定位的魅力
先看最終演示效果，具體教程請(qǐng)繼續(xù)關(guān)注，本人正抽空整理。
運(yùn)行代碼框
[Ctrl+A 全部選擇 提示：你可先修改部分代碼，再按運(yùn)行]
5．延伸閱讀
（1）詳解定位與定位應(yīng)用 小毅 藍(lán)色理想
（2）由淺入深漫談margin屬性 懌飛 藍(lán)色理想
經(jīng)典論壇討論：
http://bbs.blueidea.com/thread-2733320-1-1.html
本文鏈接：http://www.95time.cn/tech/web/2007/4601.asp 
出處：藍(lán)色理想
責(zé)任編輯：moby
上一頁(yè) 絕對(duì)定位和相對(duì)定位 [2] 下一頁(yè)
◎進(jìn)入論壇網(wǎng)頁(yè)制作、網(wǎng)站綜合版塊參加討論
|
第 1 頁(yè) 
第 3 頁(yè) 絕對(duì)定位和相對(duì)定位 [3]
