CSS背景颜色是指在CSS中使用的背景颜色。它可以用来给元素添加一个背景,以便在浏览器中显示出来。
CSS背景颜色可以使用十六进制代码(#RRGGBB)或者RGB值(rgb(R,G,B))来表示。十六进制代码是一个6位数字,前两位表示红色的强度,中间两位表示绿色的强度,最后两位表示蓝色的强度。RGB值也是一个三元数字,分别表示三原色的强度。
background-color: #FF0000; background-color: rgb(255, 0, 0);
background-color
background-image
background-repeat
background-size
background-position
background-attachment
background-clip
background-origin
background
我们可以使用 background-color
设置背景颜色。
以下代码设置背景颜色。
<!DOCTYPE HTML>
<html>
<head>
<style type="text/css">
p {
background-color: lightgray;
}
</style>
</head>
<body>
<p>This is a test.<br/>
This is a test.<br/>
This is a test.<br/>
This is a test.<br/>
This is a test.<br/>
This is a test.<br/>
This is a test.<br/>
This is a test.<br/>
</p>
</body>
</html>
我们可以使用 background-image
设置背景图像。
以下代码设置背景图像。
<!DOCTYPE HTML>
<html>
<head>
<style type="text/css">
p {
background-image: url("/statics/images/course/img_flowers.jpg");
background-size: 20px 20px;
background-repeat: repeat-x;
}
</style>
</head>
<body>
<p>This is a test. <br/>
This is a test. <br/>
This is a test. <br/>
This is a test. <br/>
This is a test. <br/>
This is a test. <br/>
This is a test. <br/>
This is a test. <br/>
</p>
</body>
</html>
z-index属性的默认值为零。
我们可以使用 background-repeat
属性控制图像将如何覆盖整个背景区域。
background-repeat
的允许值在下面的列表中描述。
您可以为水平和垂直重复设置值,但如果您只提供一个值,浏览器将在两个方向使用该重复样式。
但对于repeat-x和repeat-y,浏览器将使用无重复样式作为第二个值。
以下代码显示了如何使用 background-repeat
以使背景图像沿x轴重复。
<!DOCTYPE HTML>
<html>
<head>
<style type="text/css">
p {
background-image: url("/statics/images/course/img_flowers.jpg");
background-size: 20px 20px;
background-repeat: repeat-x;
}
</style>
</head>
<body>
<p>This is a test. <br/>
This is a test. <br/>
This is a test. <br/>
This is a test. <br/>
This is a test. <br/>
This is a test. <br/>
This is a test. <br/>
This is a test. <br/>
</p>
</body>
</html>
图像在元素上水平重复。
属性 | 描述 | CSS |
---|---|---|
background-attachment | 修复或滚动背景图像与页面的其余部分 | 1 |
background-clip | 设置背景的绘制区域 | 3 |
background-color | 设置背景颜色 | 1 |
background-image | 设置背景图像 | 1 |
background-origin | 设置背景图像的定位区域 | 3 |
background-position | 设置背景图像的起始位置 | 1 |
background-repeat | 如何重复背景图像 | 1 |
background-size | 设置背景图像的大小 | 3 |
background | 背景属性在一个声明 | 1 |
CSS 颜色使用CSS时,您可以指定不同方式范围内的颜色。我们可以使用预定义的颜色名称。或者我们可以为每个红色,绿色和蓝色组件...
CSS 注释注释用于解释您的代码,它们被浏览器忽略。CSS注释以“”结尾,例如:p{ color:red; text-align:center;}例子以下代码在...
CSS 语法 实例 查看 实例 1 查看 实例 2CSS 实例 CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明:选择器通常是您需...
CSS 简介 你需要具备的知识在继续学习之前,你需要对下面的知识有基本的了解:HTML / XHTML如果你希望首先学习这些项目,请在 入...
很多初学的朋友学完HTML后开始学习CSS,在学习中常常遇到 div+css,但是不知道什么意思。网上很多资料说div就是取代〈table〉的...