错误博客( cuowu.com )发布于 2019-06-05 10:19:17

CSS背景

CSS的背景属性,主要有背景颜色和背景图像(背景图像平铺、背景图像大小、背景图像位置等)。

CSS背景属性如下:

1)背景颜色:background-color

语法: background-color:颜色;

例如:

p {

background-color:red;

}

2)背景图像:background-image

语法: background-image:url(图像位置); 。

例如:

p {

background-image:url(1.jpg);

}

3)背景图像是否平铺:background-repeat

语法:background-repeat:值;

值:no-repeat、repeat-x、repeat-y 不平铺、沿X轴平铺、沿Y轴平铺。

例如:

p {

background-image : url(1.jpg);

background-repeat : no-repeat;

}

4)背景图像位置:background-position

语法:background-position: X轴位置 Y轴位置;

表示方法,这里讲三种,英文字母、百分比和长度值px表示。

字母:X轴:left、center、right左中右 Y轴:top、center、bottom上中下

百分比:%

例如:

p {

background-position:left top; <!—或者30% 50% –>

}

长度值:指元素元素内边距区左上角的偏移。偏移点是图像的左上角。

例如:

p {

background-position:100px 200px;

<!—图像左上角向右移动100像素,向下移动200像素–>

}

如仅写一个值,则另外一个值为50%或center的含义。

5)背景图像是否固定:background-attachment

默认值为scroll,图像随着文档滚动。禁止滚动值为fixed。

例:

p {

background-image:url(1.jpg);

background-attachment:fixed;

}

6)背景复合属性:background

复合属性就是把上面属性都写在一起。

例:

p{

background : red url(1.jpg) left center fixed;

}


2020年错误博客亲测项目系列

错误教程( cuowu.com )专注网推培训、SEO培训和网赚培训,微信/电话:13722793092

关注微信公众号:第一时间获得错误博客最新教程,让我们一起成长!

公众号二维码