1首先當(dāng)然是要插入一張圖片啦，代碼如下lta href=quot#quot target=quot_blankquotltimg src=quotimages13pngquot width=quot240quot heigth=quot240quotlta 圖片路徑自己定義2定義一個層在圖片上這里要用到定位positionltdiv。

2然后在上方的head標(biāo)簽中的style標(biāo)簽設(shè)置樣式，這里設(shè)置圖片的寬度和高度并設(shè)置相對定位，然后設(shè)置圖片的鼠標(biāo)懸浮樣式，其中設(shè)置動畫的形式為3d以及設(shè)置圖片3d旋轉(zhuǎn)偏移的角度，添加一個動畫，設(shè)置好延時即可3最后打開瀏覽器。

lt！doctype htmllthtmlltheadltmeta charset=quotutf8quotlttitle無標(biāo)題文檔lttitleltheadltbodyltstyleul，liliststylemargin0padding0liwidth287pxheight287pxpositionrelativeli adisplay。

ltdiv class=quotdivcss5quot ltdiv class=quotbox1quot布局靠左浮動ltdiv ltdiv class=quotbox2quot布局靠右浮動ltdiv ltdiv class=quotclearquotltdivlt！ html注釋清除float產(chǎn)生浮動 ltdiv效果如下浮動利用。

這個屬于字符文件，在電腦的系統(tǒng)盤中的font文件夾中，不過很多特效屬于特殊軟件自帶的，屬于網(wǎng)絡(luò)的，沒有地方文件。

原理它的本質(zhì)就是建構(gòu)了一個BFC，這樣使得達(dá)到撐起父元素高度的效果優(yōu)點簡單，代碼少，瀏覽器支持好 缺點不能和position配合使用，因為超出的尺寸的會被隱藏 建議只推薦沒有使用position或?qū)verflowhidden理解比較。

html做鼠標(biāo)懸浮菜單上的選項能出現(xiàn)下拉菜單，CSS+JS做出此效果ltbody內(nèi)代碼為ltUL id=fm ltLIltA href=quot#quot一級菜單欄目ltA ltUL ltLIltA href=quot#quot一級菜單目錄ltAltLI ltLIltA href=quot#quot一。

CSS懸浮應(yīng)用很廣泛，常見的應(yīng)用如菜單欄頁面浮動廣告網(wǎng)頁底部返回頂部的按鈕等在設(shè)計美觀的網(wǎng)頁時，CSS懸浮可以達(dá)到諸多效果，比如使網(wǎng)頁更加流暢，增強用戶體驗CSS懸浮的實現(xiàn)需要熟悉CSS布局知識，掌握CSS定位和zindex。