有关background一些基本属性_background body-优快云博客

本文链接：https://blog.youkuaiyun.com/qianhua521/article/details/53148674

1. background是背景的综合属性，可以拆分成多个单属性

2.color是背景颜色可以和image共存，它的层次在image之下

3.repeat，默认就是在水平和垂直方向都重复repeat-x和repeat-y 吐舌头

4.clip 是背景图片剪裁（覆盖的区域），clip 剪裁的区域，设置哪个区就显示哪个区域 */
/*background-clip: padding-box;*/
/*background-clip: content-box;*/

5.size 对背景颜色没有影响，可以设置背景图片的显示的大小，可以用px和百分比（使用整个元素的长度进行计算）

6.position:left top;
left是第一个参数，表示背景在水平方向上的偏移量
top是第二个参数，表示背景在垂直方向上的偏移量
它们可以取值 px 百分比以及 top left right bottom center

7. attachment 设置背景是否滚动
fixed 是把背景的与视口固定，造成背景固定的感觉
scroll 是把背景与元素本身固定

ackground-attachment: fixed;

background-size: 300px 100px;
/* 当内容超过元素大小时，可以设置滚动，下面的样式是在垂直方向上滚动 */
overflow-y: scroll;

attachment 设置背景图片是否随着内容滚动，fixed的效果是将图片固定在视口原点，scroll在元素中定位
一般在body中使用，造成整个页面背景固定的效果
*/
/*background-attachment: fixed;*/

8.origin 是背景图片摆放的坐标体系 */
background-origin: content-box;
background-origin: border-box;
background-origin: padding-box;

实例操作：（“/*

<!DOCTYPE html>
<head>
<title>star</title>
<meta charset="utf-8">
<style type="text/css">
/*clip实例*/
div{
width: 400px;
height:300px;
margin: 20px;
padding: 20px;
background-image: url(res/news.jpg);
/*