CSS3新属性

scroll-padding-top

scroll-padding-top的值就是锚到目标之间的距离

<!--	锚	-->
<a href="#section-first">Section 1</a>

....

<main>
  <!--	目标	-->
  <section id="section-first">
    <h2>Lorem ipsum title 1</h2>
    <article>
      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse ullamcorper, massa eu rhoncus porttitor, enim dui scelerisque augue, sed eleifend quam dolor rhoncus dolor. Nunc sit amet ornare mi, eu vestibulum lectus. Mauris ac ultricies felis. Praesent ut orci vestibulum, tincidunt purus in, malesuada elit. Phasellus tempor dolor at accumsan suscipit. Maecenas efficitur hendrerit enim id pellentesque. Nunc placerat nibh sit amet malesuada vestibulum. Ut scelerisque sit amet velit in mattis. Mauris erat augue, eleifend nec posuere nec, vehicula vitae nibh. In hac habitasse platea dictumst.
    </article>
  </section>
  ...
</main>

currentColor

设置内联样式的SVG颜色，fill属性的值替换成currentColor

isolation

创建一个新的层叠上下文或者分组来起到隔离的作用

font-variant-numeric

当我们在做倒计时或者从0开始增加到某一个数值的动画效果时，由于不同数字的宽度不同，在动画执行期间会发生文字不停的左右摆动的现象。tabular-nums就可以使所有的数字都变成一样的宽度

参考链接:

• https://juejin.cn/post/7118892686861402120