背景属性一-【官方】百战程序员_IT在线教育培训机构

属性	描述
background-color	设置背景颜色
background-image	设置背景图片
background-attachment	设置背景图片是随内容滚动还是固定
background-position	设置背景图片显示位置
background-repeat	设置背景图片如何填充
background	复合属性

background-color属性

该属性设置背景颜色


xxxxxxxxxx
<div class="box"></div>
.box{
    width: 300px;
    height: 300px;
    background-color: palevioletred;
}

background-image属性

设置元素的背景图像

元素的背景是元素的总大小，包括填充和边界（不包括外边距）。默认情况下background-image属性放置在元素的左上角，如果图像不够大的话会在垂直和水平方向平铺图像，如果图像大小超过元素大小从图像的左上角显示元素大小的那部分


xxxxxxxxxx
<div class="box"></div>
.box{
    width: 600px;
    height: 600px;
    background-image: url("https://www.itbaizhan.com/wiki/images/img1.jpg");
}

background-repeat属性

该属性设置如何平铺背景图像

值	说明
repeat	默认值
repeat-x	只向水平方向平铺
repeat-y	只向垂直方向平铺
no-repeat	不平铺


xxxxxxxxxx
.box{
    width: 600px;
    height: 600px;
    background-color: #fcc;
    background-image: url("https://www.itbaizhan.com/wiki/images/img1.jpg");
    background-repeat: no-repeat;
}

实时效果反馈

1.下列关于background-repeat属性描述错误的是：

A repeat-x只向水平方向平铺

B repeat-y只向垂直方向平铺

C no-repeat不平铺

D repeat默认不平铺

答案

1=>D

字体属性背景属性二

北京市昌平区回龙观镇南店村综合商业楼2楼226室