设计之家 > 靈感 > 網頁UI > 網頁理論 >

如何進行層的絕對定位

作者:未知 來源:問題 時間:2005-05-10
一. 常出現的問題

當你的表格選居中的時候又插入了層(插入層方法1:object->draw layer)的時候(800*600),分辨率一旦變大、窗口最大化之后,層就錯位了,而如果使用菜單(插入層方法2:Insert->Layer)插入層的時候,這個層就會與它的上級元素相對定位,但是一旦在Dreamweaver中用移動工具動了它,它就會馬上變成絕對定位,不會再與上級元素相對定位了。

二. 思想:

通過object面板置入的層是絕對定位的層,這個絕對定位指的是層的左上角與瀏覽器窗口內部的左部、頂部距離,代碼中的寫法是left與top。
通過菜單置入的層是相對定位的層,這個相對定位指的是層與它的上級元素的距離(它的上級元素的左上角),由于這個P中不再有left與top的屬性,所以瀏覽器把它的位置定為與它的上級元素相同

(總結一:只要去掉層的left與top屬性就可以相對定位!)

三. 深入思想:

現在層已經相對定位了,可是只是這樣還完全不能滿足要求,因為很多時候不能把表格設定得那樣準確,否則會把表格搞得很麻煩,把代碼搞得很大很大。
如果在上面說做出的相對定位的層的基礎上再做一個層對它相對定位,不就解決問題了嗎?
這就涉及到了父層與子層的問題(由于它是層的基礎,在書與網上教程中就可以看到,這里不再闡述),父層相對于某點定位,而子層相對于父層定位,就可以達到層的相對定位這個目標了

四. 具體制作(只介紹最簡單的方法,對代碼熟的朋友可以手敲的):

先在頁面內插入表格(可以設居中,表格就居中了,否則幾乎無意義),鼠標在某單元格內點一下,讓光標在此閃動,然后通過菜單插入一個層,這個層就相對與這個單元格定位了。插入一個層之后,不要動它,而且也永遠不要動,但是可以更改它的大小,比如把它的高與寬都改成"0",讓它不再影響你對其他內容的編輯,否則,這個層的left與top屬性出現之后就成了絕對定位了,變成絕對定位后你可以把它的left與top屬性去掉,就恢復成相對定位了。變成"0"之后,有時子層會看不見,可以按[f11]鍵點它恢復編輯。
現在光標在這個層內閃動,再通過菜單插入子層,這時子層與父層重疊,你可以隨意移動它,不管怎么動,它都是相對與父層定位。
好了,一個相對定位的層(子層)做好了,你可以在里面隨意添加內容了,也可以改變它的尺寸、位置、背景等所有屬性,但是不要動left與top屬性,因為它是相對于父層的左上角定位的。

五. 技巧:

先插入一個表格,在其中一個單元格中插入父層,可以把它定得小一點,比如說20象素寬、10象素高,這樣它就不會蓋住下面的鏈接,也不影響子層的相對定位。
如果要用778象素寬定義表格,可以把父層插入到表格的第一行第一個單元格中,這樣就可以在所有層制作完后插入父層了!對代碼熟的朋友就可以手敲父層而不必再去調整子層的位置了。
标签:

相關文章:

推薦設計

最新文章