CSS 日常练习----背景图片和背景色层级

记录日常 CSS 练习的小知识点 —— 背景图片和背景色层级

背景图片和背景色层级

点击预览

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.test{
width: 50px;
height: 100px;
background: #000;
background-image: url("images/arrow 2.png");
}
</style>
</head>
<body>
<p>background-image和background-color同时设置,背景图片在背景色之上</p>
<p>如果给一个元素设置两个background,尽管一个是color一个是image,后一个依然会盖住前一个,解决:给第二个设置一个具体属性</p>
<div class="test">
</div>
</body>
</html>
0%