該篇僅是本人學習前端時,做的備忘筆記:
一、背景圖片設定:
設定背景圖時的css代碼:background-image:url(圖片的url路徑);
ps:設定好這個背景后請一定要設定該背景圖片的大小和該背景圖片的顯示區域,css樣式設定如下:
e.g. background-image:url(圖片的url路徑); width:18px;height:18px; 不設定的話,出現的情況就是只有該內容區域有內容時,才會出現背景圖片;ps:因為要讓一個區域的背景圖片顯示的話,那前提肯定是得先讓背景圖片所在的塊級區域有寬度和高度(高度必須要有,寬度沒有則默認寬度為整個瀏覽器的寬度)才行啊,背景圖片的平鋪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為準
頁面的滾動條,滾動,背景圖不會隨著發生位置變化
但是,只能在本容器區域內顯示
轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/85269.html
標籤:Html/Css
上一篇:flex space-between最后一行對齊問題的解決方案
下一篇:前端遇到瓶頸了怎么辦?
