background image属性详解

应用场景：

将图片当作背景

使用方法

background-image: url(“”) ;

相关常用属性

• background-repeat属性（背景平铺）
  repeat 默认值，在水平方向和垂直方向都重复（默认值）
  no-repeat 不重复背景图像
  repeat-x 只有水平位置会重复背景图像
  repeat-y 只有垂直方向会重复背景图像
• background-size属性（设置背景图片大小）
  width height进行设置 px或者百分比
  auto
  cover：保持图像的宽高比例，将图片缩放到正好完全覆盖定义的背景区域，其中有一边和背景相同
  contain：保持图像的宽高比例，将图片缩放到宽或者高正好适应定义背景的区域，但背景仍在定义的区域之内，被包含。
• background-position属性（背景图片位置）
  百分数（50%、50%代表中心位置）
  像素值（10px、20px代表左上角向下10px，向右20px）
  直接指定位置 （center、top、bottom、left、right）