1、<img>标签的object-fit和object-position
img元素有两个特别的属性
object-fit和object-position属性。它们让我们可以控制 <img>的内容如何调整大小和位置，就像CSS背景图片一样。
object-fit的可能值有：fill, contain, cover, none, scale-down
它可以这样使用。
img {
object-fit: cover;
object-position: 50% 50%;
}
怎么理解勒，简单点就是比如一张图片400400，但是你给<img>大小是10050,那么这个图片就会变形，但是可以用这两个属性就变成了类似一个div，背景是这个图片，当成了一个背景使用，而不会被变形了，特殊需求可能会很有用。
2.背景绘制区域background-clip
可选值有：
background-clip: border-box | padding-box | content-box;
border-box 包含边框
padding-box 除边框外全部绘制
content-box 仅绘制内容区域
这个给个图应该就明白用处了：
border-box
content-box
padding-box
3、背景滚动background-attachment
属性值：
background-attachment: scroll | fixed | local;
scroll 默认。背景图片随页面滚动而滚动
fixed 背景图片不会随页面滚动
local 背景图片随内容滚动而滚动
这个做一些网站首页的背景特效很好看，这个不好给效果图（主要是懒不想做动图）就理解下属性值的解释吧 不解释了
4、文字垂直显示
writing-mode: vertical-rl | vertical-lr;
文字可以向古文那样垂直显示，vertical-rl垂直从右到左，vertical-lr垂直从左到右
