CSS背景屬性(background):
1.添加背景圖片屬性：
background-image:url(背景圖片的路徑);
所有url都有相對路徑和絕對路徑：
1>相對路徑：(相對于當前檔案夾尋找目標檔案)
"/":表示當前檔案的下一級(根)目錄；
"./":表示當前檔案夾；
"../":表示當前檔案夾的上一級目錄；
2>絕對路徑：(相對于總根(某個物理磁盤)目標檔案的物理路徑)
*通過選中目標檔案，"右擊"—>"屬性"—>"詳細資訊"選項卡查看目標的絕對路徑。
2.添加背景顏色屬性
background-color:關鍵字|十六進制顏色值;
1>關鍵字(各種顏色的英文單字)eg:red(紅)、green(綠)、blue(藍)、black(黑)、gray(灰)、pink(粉)、purple(紫)、
yellow(黃)、white(白)、orange(橙)、
3>十六進制顏色值:eg(#ff0000(紅)、#00ff00(綠)、#0000ff(藍)、#000000(黑))
3.設定背景圖片是否重復屬性
background-repeat:no-repeat|repeat-x|repeat-y|space|round;
repeat-x(水平方向重復);
repeat-y(垂直方向重復);
no-repeat(默認屬性)不重復;
space(重復顯示背景圖片，調整背景圖片四周的空白防止裁掉圖片);
round(重復顯示背景圖片，縮放背景圖片防止區域裁掉區域圖片);
4.定位背景圖片位置屬性
background-position:屬性值1(水平方向) [屬性值2(垂直方向)];
有效屬性值可以是:百分比、像素值、關鍵字；
*屬性值2的值默認為center
1>eg:background-position:20% 20%;
2>eg:background-position:100px 100px;
3>eg:background-position:right bottom;
4>eg:background-position:20% 100px;|background-position:100px top;(有效屬性值可以混合使用)
*關鍵字(left、center、right、top、bottom)
5.設定背景圖片的大小
background-size:屬性值1(寬度) [屬性值2(高度)];
有效屬性值可以是:百分比、像素值、關鍵字；
*關鍵字(cover、contain)
cover:縮放圖片完全填充指定的背景區域(不是完全等比例縮放)
contain:完全等比例縮放，適應指定的背景區域
6.設定背景圖片在網頁中是固定還是滾動
background-attachment:
scroll 默認值。背景影像會隨著頁面其余部分的滾動而移動。
fixed 當頁面的其余部分滾動時，背景影像不會移動。
inherit 規定應該從父元素繼承 background-attachment 屬性的設定。
7.設定背景圖片的顯示方式
background-clip:
conter-box:裁剪圖片使之適應內容后面的區域。
padding-box:裁剪圖片使之適應內容和填充后面的區域。
border-box:裁剪圖片使之適應內容、填充和邊框后面的區域。
8.設定背景圖片的位置
background-orign:
center-box:相對內容區域定位
padding-box:(默認)相對填充區域定位
border-box:相對邊框區域定位
*當設定了background-attachment:fixed;時，background-origin的設定是不起作用的。
9.background 設定背景的全部屬性;
eg:background: #00FF00 url(bgimage.gif) no-repeat fixed top;
*屬性與屬性之間用空格隔開
uj5u.com熱心網友回復：
謝謝分享。。。。uj5u.com熱心網友回復：
哈哈哈，可以uj5u.com熱心網友回復：
剛開始接觸網頁，請多多指教，，謝謝!轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/129032.html
標籤：非技術區
上一篇：跳轉不按順序，請大佬幫我看看
下一篇：一個很簡單的問題