專注Java教育14年
全國咨詢/投訴熱線：400-8080-105
更新時間：2022-02-17 10:36:45 來源：動力節點 瀏覽1007次
為 <body>元素設置背景圖像：
body {
background-image: url("paper.gif");
background-color: #cccccc;
}
為 <body>元素設置兩個背景圖片：
body {
background-image: url("img_tree.gif"), url("paper.gif");
background-color: #cccccc;
}
該background-image屬性為元素設置一個或多個背景圖像。
默認情況下，背景圖像放置在元素的左上角，并在垂直和水平方向重復。
提示：元素的背景是元素的總大小，包括內邊距和邊框(但不包括邊距)。
提示：如果圖像不可用，請始終設置要使用的背景顏色。
background-image: url|none|initial|inherit;
為 <body>元素設置兩個背景圖像。讓第一個圖像只出現一次(不重復)，讓第二個圖像重復：
body {
background-image: url("img_tree.gif"), url("paper.gif");
background-repeat: no-repeat, repeat;
background-color: #cccccc;
}
使用不同的背景屬性來創建“英雄”圖像：
.hero-image {
background-image: url("photographer.jpg"); /* The image used */
background-color: #cccccc; /* Used if the image is unavailable */
height: 500px; /* You must set a specified height */
background-position: center; /* Center the image */
background-repeat: no-repeat; /* Do not repeat the image */
background-size: cover; /* Resize the background image to cover the entire container */
}
將線性漸變(兩種顏色)設置為<div>元素的背景圖像：
#grad1 {
height: 200px;
background-color: #cccccc;
background-image: linear-gradient(red, yellow);
}
將線性漸變(三種顏色)設置為<div>元素的背景圖像：
#grad1 {
height: 200px;
background-color: #cccccc;
background-image: linear-gradient(red, yellow, green);
}
repeating-linear-gradient() 函數用于重復線性漸變：
#grad1 {
height: 200px;
background-color: #cccccc;
background-image: repeating-linear-gradient(red, yellow 10%, green 20%);
}
將徑向漸變(兩種顏色)設置為<div>元素的背景圖像：
#grad1 {
height: 200px;
background-color: #cccccc;
background-image: radial-gradient(red, yellow);
}
將徑向漸變(三種顏色)設置為<div>元素的背景圖像：
#grad1 {
height: 200px;
background-color: #cccccc;
background-image: radial-gradient(red, yellow, green);
}
repeating-radial-gradient() 函數用于重復徑向漸變：
#grad1 {
height: 200px;
background-color: #cccccc;
background-image: repeating-radial-gradient(red, yellow 10%, green 20%);
}
Java實驗班
0基礎 0學費 15天面授
Java就業班
有基礎 直達就業
Java夜校直播班
業余時間 高薪轉行
Java在職加薪班
工作1~3年，加薪神器
Java架構師班
工作3~5年，晉升架構
提交申請后，顧問老師會電話與您溝通安排學習
官方微信
官方抖音
京公網安備 11030102010736號