CSS背景

背景颜色 background-color   (bgc)

 

背景图片 background-image   (bgi)

 

背景是否平铺 background-repeat（bgr）

background-repeat设置背景重复 

{repeat-x  水平方向重复

repeat-y  垂直方向重复

repeat  平铺}

 

背景位置 background-postion(bgp)

默认位置left top  如何只写一个参数，另一个参数为默认为center

精确单位  格式：     background-postion: x轴  y轴;

可混搭使用

{blackground-postion:值  center top bottom right left  或使用百分数值    x%  x% 或使用长度值 100px }

 

 

背景关联 background-attachment (bga)

默认值为 scroll 默认背景随文档滚动

背景固定  fixed

 

背景简写

background: 背景颜色  背景图片地址  背景平铺  背景滚动  背景位置     以空格隔开

 

背景透明:

background:rgba()

 

背景缩放

插入的图片直接用width和height设置

background-size(背景图片 bgs) : 宽度  高度 

一般只改一个参数 防止缩放失真  也可用百分比

参数

cover（重点）   会自动缩放比例，保证图片始终填充满背景区域，如有溢出部分则会隐藏(高和宽都达成盒子，就停止)

contain 自动调整缩放比例，保证图片始终完整显示在背景区域(高和宽一个达成盒子高度，就停止)

 

多背景

background：url 

url

最后定义背景颜色

 

小技巧：在一行的盒子内，设置行高等于盒子的高度，可以使文字垂直居中