該篇僅是本人學習前端時,做的備忘筆記: 一、背景圖片設置: 設置背景圖時的css代碼:background-image:url(圖片的url路徑); ps:設置好這個背景後請一定要設置該背景圖片的大小和該背景圖片的顯示區域,css樣式設置如下: e.g. background-size:36px 3 ...
該篇僅是本人學習前端時,做的備忘筆記:
一、背景圖片設置:
設置背景圖時的css代碼:background-image:url(圖片的url路徑);
ps:設置好這個背景後請一定要設置該背景圖片的大小和該背景圖片的顯示區域,css樣式設置如下:
e.g. background-size:36px 36px; width:18px;height:18px; 不設置的話,出現的情況就是只有該內容區域有內容時,才會出現背景圖片;背景圖片的平鋪css樣式:background-repeat:repeat/no-repeat/repeat-x/repeat-y;
背景圖片的定位:background-position:
取值 1.x y 以px為單位的數字,定義x軸和y軸的位置
2.x% y%
3.x 或者 x%,不寫y,預設y為50%
4.關鍵字 x:left/center/right y:top/center/bottom
背景圖片的固定
background-attachment:
取值:1.scroll 預設值,背景圖定位以容器為準
背景圖會隨著頁面滾動條滾動而變化
2. fixed 固定,背景圖定位以body為準
頁面的滾動條,滾動,背景圖不會隨著發生位置變化
但是,只能在本容器區域內顯示