用的比较少但是很实用的css属性，总结

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垂直从左到右