更新時(shí)間：2013-10-15
招數(shù)一：表格定位法
步驟1：打開Dreamweaver，新建一個(gè)頁(yè)面，使用快捷鍵“Ctrl+Alt+T”插入一個(gè)兩行一列的表格，設(shè)置第二行的目的就是為了放置層，使其相對(duì)表格定位。輸入文字同時(shí)設(shè)置表格屬性。
步驟2：將光標(biāo)移入第二行表格中，在這行中插入一個(gè)層，打開其屬性面板，將L、T值刪除，使其為空。
這兩個(gè)參數(shù)絕對(duì)不能有數(shù)值，否則將不能實(shí)現(xiàn)層精確定位。當(dāng)然這時(shí)的層參數(shù)已定，作為父層時(shí)該層是不能移動(dòng)的，但可以使用光標(biāo)改變其大小。
步驟3：將光標(biāo)定義在父層中，再次插入一個(gè)層并設(shè)置層內(nèi)容。當(dāng)你使用F2打開層控制面板時(shí)會(huì)看到位于父層底下的子層，作為子層是可以拖動(dòng)的，因?yàn)樗鄬?duì)于父層定位。
步驟4：為主菜單設(shè)置鼠標(biāo)響應(yīng)事件，顯示當(dāng)鼠標(biāo)移到和離開該主菜單時(shí)層的顯示方式就可以了。F12預(yù)覽并改變分辨率，看看是否你的子菜單沒(méi)有錯(cuò)置。
招數(shù)二：CSS定位法
上述方法畢竟不是專業(yè)設(shè)計(jì)師的期望，我們可以做一個(gè)CSS相對(duì)定位的定義方式，將相對(duì)定位模型（比如表格）定義為這個(gè)CSS屬性。
步驟1：使瀏覽器以相對(duì)定位模型左上角作為原點(diǎn)，建立新的坐標(biāo)系。再在這個(gè)相對(duì)定位模型下級(jí)插入層，使之絕對(duì)于該相對(duì)定位模型定位。當(dāng)然該層也是不可拖動(dòng)的，改變其位置可以直接在其屬性面板上輸入Left Top的數(shù)值。
步驟2：按“Shift+F11”打開CSS Styles面板，點(diǎn)擊“New Style”按鈕，在彈出的New Style窗口中定義一個(gè)名稱為。pos的CSS屬性，并且選擇Make Custom Style的Type類型和This Document 0nl的Define類型，確認(rèn)進(jìn)入Style Defintion For .pos窗口，選取Positioning定義Type為relative確定。
步驟3：選取定義好的表格，右鍵點(diǎn)擊CSS Style面板中的。pos，彈出菜單中執(zhí)行Apply命令即可。使該相對(duì)定位模型（表格）建立新的坐標(biāo)系，只要我們?cè)谄渲胁迦雽�，并設(shè)置層內(nèi)容和主菜單的鼠標(biāo)響應(yīng)事件就可以使層實(shí)現(xiàn)相對(duì)定位了。
