DivCSS布局實例：詳解建立Flash上面浮動層_DIV+CSS實例

　　
　　版權聲明：本文由九扎、MrJin共同完成，如需轉載請聯系作者。

　　最近群里有很多朋友在討論，如何在Flash上面建立一個層，這個層位于Flash之上而不被Flash覆蓋。這是一個比較常見的案例，在現實工作中有著很大的意義。
　　例如，我們在頁面頂端設置一個Flash動畫，但想在這個動畫上面浮動一層，可以放置鏈接或說明文字等。這樣的編碼更加易于修改，也更輕易被搜索引擎收錄；更重要的是，假如用戶屏蔽了Flash，依然可以看到浮動層上的文字。
　　廢話不多說，看這個實例的最終效果。


　　紅色的區域即是浮于Flash之上的層。層內放了一個文字鏈接。
　　看下面的XHTML編碼：


　　建立一個DIV，設置其ID為flash。插入一個flash動畫hehe.swf。
　　在這個DIV內部，嵌套一個DIV，設置ID為nav。
　　下面我們開始CSS編碼：


　　body是整體布局聲明。
　　ID為flash的層設置為，距離頂部20px并水平居中對齊，寬度與高度正好與FLASH文件相同，應用相對定位。
　　ID為nav的層設置為，絕對定位，距離左側與頂部分別是50px、30px，寬度為400px，行高30px，文字居中對齊，文字加粗。層的背景色為#f00紅色。設置邊框為一象素的實線并設置成白色。
　　對nav層的鏈接進行設置，鏈接文字顏色為白色，懸停狀態為淺黃色。
　　至此我們初步編碼已經完成。看看是何效果：


　　運行后我們發現，并沒有出現想要的效果。nav層根本沒有出現，不知道這個家伙跑到哪里去了。
　　我們在HTML代碼中增加一條語句：


　　設置Flash為透明效果，看看運行效果：


　　在IE中，已經達到了最終的效果，但是在FF中，我們發現動畫不見了。
　　為了能兼容FF顯示，我們在HTML中增加下面的代碼：


　　現在我們看看是什么運行效果了：


　　一切正常，在IE與FF中均實現了在Flash上面建立浮動層。
　　此案例最需要大家注重的有以下幾個地方：


　　版權聲明：本文由九扎、MrJin共同完成，如需轉載請聯系作者。