【CSS】圖片不隨著頁面捲動
由於工作上的需要，而在網路上到處爬文，以往這樣的效果是使用Javascript呈現的，不但程式碼攏長而且有時還會卡卡的，或造成畫面閃爍。 現在CSS愈來愈強大及瀏覽器版本支援性佳，只要幾行簡單的 CSS 語法便能製作出同樣的效果。 而這個 CSS 語法的關鍵便是 position:fixed。 部分HTML : <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> '不能省略，效果會跑不出來 <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>經費總表</title> .....省略之..... <style type="text/css"> /* 右邊圖片按鈕,不隨著捲軸而變動*/ #fixed-ad { /* 回上一頁 */ background-image:url(/img/back1.png); width:50px; height:50px; position:fixed; top:200px; right:0px; _position: absolute; /* position fixed for IE6 */ _top:expression(documentElement.scrollTop+200); _right:expression(documentElement.scrollRight+0); z-index:3; } #fixed-ad2 { /* 回主頁 */ background-image:url(/img/back_main.png); width:50px; height:50px; position:fixed; ...