添加背景图片以及设置

添加背景图片以及设置

background

• 作用：是用来集中设置各种背景属性
• 例子：

background: url('./assets/acg.png') center no-repeat;

background-image

• 作用设置背景图片的url:
• 例子

  background-image: url('./assets/acg.png');

以上两者区别

• 前者：是background的各种属性的集合（其中包含background-image）
• 后者：是background中的一个属性

background-size

cover

• 作用：按比例缩放图片，让图片覆盖整个容器。
• 弊端：可能会造成部分背景图片显示不出来
• 例子

contain

• 作用：按比例缩放图片，让图片全部容纳在容器中
• 弊端：可能导致容器一部分空白

• 例子

  
  
  

  Pasted_Image_12_01_2018__10_06_PM.png