Day25 切版的时候，该注意图片的设定。

大家好，我是乌木白，今天要和大家介绍图片经常会出错的地方～

img 和 background-img 傻傻分不清楚？

我自己当初在学习的切版的时候，一度把 img 及 background-img 搞混，後来才知道 img 其实就是在你的图片，有机会长期的更换所以使用 img；另一方面因为 background-img 是主题的照片，可能不常更换，所以使用这个属性。

网页常见的错误：图片比例变形

常见的错误就是把 img 设定了固定高度，又把宽度设定 width:100%

原图：

示范图片：

无限延伸

使用 background-img 的方式

这是一个比较简单的作法，将 img 中的图片使用 background-image来呈现，并使用 background-size: cover; 方式来限制显示区域，同时也可搭配 background-position 来调整图片的显示位置。

可搭配 background-position 来调整背景图的位置。

示范：

  background-cover {
  background-position: center center;
  background-size: cover;
}

background-size: cover;可以让背景图覆盖整个区域，此做法也会裁切掉部分图片；如果图片主题被裁切可试着改变 background-position 属性。因为有一定的机率可能会裁掉图片，如果发生的话，是否要选择更换图片！