CSS 新属性
CSS 新属性
content-visibility 主要用来提高页面渲染性能，它可以控制一个元素是否渲染其内容，并且允许浏览器跳过这些元素的布局与渲染
- visible：默认值，没有效果。元素的内容被正常布局和呈现。
- hidden：元素跳过它的内容。跳过的内容不能被用户代理功能访问，例如在页面中查找、标签顺序导航等，也不能被选择或聚焦。这类似于给内容设置
display: none。 - auto：该元素打开布局包含、样式包含和绘制包含。如果该元素与用户不相关，它也会跳过其内容。与 hidden 不同，跳过的内容必须仍可正常用于用户代理功能，例如在页面中查找、tab 顺序导航等，并且必须正常可聚焦和可选择。
content-visibility: hidden手动管理可见性
效果与 display: none 类似，但它只是隐藏了子元素，自身不会被隐藏
content-visibility: auto 跳过渲染工作
它可以用来跳过屏幕外的内容渲染，对于这种有大量离屏内容的长列表，可以大大减少页面渲染时间
常用来优化长列表的渲染，减少渲染时间
需要和 contain-intrinsic-size搭配使用，通过它来指定未渲染元素的大小来确保未渲染子元素的div仍然占据空间，同时也保留延迟渲染的好处。
**contain-intrinsic-size **
- contain-intrinsic-width
- contain-intrinsic-height
总结：
可通过：
content-visibility: auto
contain-intrinsic-size: 200px
来加载长列表，减少渲染时间，提高页面渲染性能。
