接上篇→
目录
3.CSS背景
通过CSS背景属性，可以给页面元素添加背景样式。
背景属性可以设置背景颜色、背景图片、背景平铺、背景图片位置、背景图像固定等。
3.1 背景颜色
background-color属性定义了元素的背景颜色。
语法格式
background-color： 颜色值；一般情况下默认为：transparent（透明）
3.2 背景图片
background-image 属性描述了元素的背景图像。实际开发常见于logo或者一些小装饰性的图片或者超大的背景图片，优点是非常便于控制位置。
语法：
background-image ：none | url(url)| 参数值 | 作用 |
| none | 无背景图（默认） |
| url | 使用绝对或相对的地址指定背景图片 |
例子：在div盒子中使用背景图片，效果如下：
代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>背景图片</title>
<style>
div {
width: 300px;
height: 300px;
background-image: url(西安科技大学logo.png);
}
</style>
</head>
<body>
<div></div>
</body>
</html>3.3 背景平铺
如果需要在HTML页面上对背景图像进行平铺，可以使用background-repeat属性。
background-repeat：repeat | no-repeat |repeat-x | repeat-y默认是平铺的（repeat）；不平铺（no-repeat）；沿x轴平铺(repeat-x)；沿Y轴平铺(repeat-y)。
页面元素可以加背景颜色也可以加背景图片只不过背景图片会压在背景颜色之上。
3.4 背景图片位置
利用background-position属性可以改变图片在背景中的位置。
语法格式：
background-position： x y;参数代表的意思是：x坐标和y坐标。可以使用方位名词或者精确单位。
| 参数值 | 说明 |
| length | 百分数|由浮点数和单位标识符组成的长度值 |
| position | top|center|bottom|left|cente |
最低0.47元/天 解锁文章
87
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
