CSS背景属性详解-优快云博客

本文深入讲解CSS中背景属性的应用，包括背景颜色、背景图片、背景平铺、背景位置、背景附着及背景简写等核心概念。通过实例演示如何设置元素的背景样式，帮助读者掌握CSS背景属性的使用技巧。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

css之第三天笔记

1.背景颜色图片及其平铺

	<style type="text/css">
	div {
		height: 300px;
		width: 300px;
		background-color: pink;   /*背景颜色*/
		background-image: url(1542373246758.jpeg);/*背景图片   图片要和文件放在同一个文件夹*/
		background-repeat: no-repeat;/*是否平铺，默认上下左右都平铺，no-repeat不平铺，repeat上下左右都平铺，repeat-x平铺，repeat-y竖铺*/
	}
</style>

2.背景图片位置
1.方向位操作

  /*利用方位名称top bottom right left center来更改背景图片位置*/
	background-position: center center;
	/*默认坐上角 ，方位名称没有顺序*/
	/*如果方位名词只写一个，另一个默认为center*/

2.数字操作

 background-position: 10px  30px;

  3.混搭

background-position: 10px center;

3.背景附着
也就是说背景随着滑轮滚动还是固定不动

background-attachment: fixed;/*默认是scroll,不随着滚轮一起移动*/

4.背景简写
按背景颜色背景地址背景平铺附着位置

background: #000 url(pic/OIP.jpg) no-repeat fixed center -25px;