[13th-铁人赛]Day 10:Modern CSS 超详细新手攻略 - background

一个单调的网页，配上精美的背景图片将带来意想不到的惊艳，但在加入背景图片可不是这麽简单，今天来介绍关於背景的各种属性!

background-color
背景不只可以放上图片，也可以用颜色来增加色彩，单色或渐层都可以
background-image
常用做法是使用url()加上图片路径
background-repeat
设定完背景图片时，因为图片尺寸不符合，有时会出现图片重复的情况，可以在这个属性调整

可以依水平或垂直轴做repeat，重复的图片间须有空格即可以使用round，或是no-repeat来取消重复
background-position
这个属性可以调整背景图片的位置，可以以数值或方向设定

center指的是将图片居中，而且其他方向指的是为该方向为基准边，而只写一个方向，另一方向预设将为center

可设定更精准的数值，指的是bottom往上推10px开始算起。请注意当一边方向已写top，另一方不可再写top或bottom。
background-size
希望调整图片大小时可以使用该属性，可以设定为关键字或是数值

a. cover 当图片小於内容，并且不希望repeat的情况下，此属性值可将图片放大至内容大小(可能失真)
b. contain 当图片大於内容，希望图片可完整呈现，此属性值可将图片缩小至内容大小
c. 设定数值若只写1个，即为宽度，高度将预设为auto。若写2个数值，即前面是宽度、後面是高度。
background-attachment
若内容可以滚动，可设定滚动内容时图片是否跟着滚动

a. scroll: 背景随外围页面滚动而移动
b. fixed: 背景完全固定，不随内容滚动
c. local: 背景随着自身内容滚动