css问题

transform: translateZ(0); 和 will-change: transform; 是CSS中的属性，通常用于优化网页上的动画和过渡效果。

1. transform: translateZ(0);

   • 这是一个CSS变换属性。translateZ(0) 的作用是将元素在Z轴上（即屏幕垂直方向）移动0像素。虽然这看起来似乎没有实际移动元素，但它可以触发硬件加速。
   • 在某些情况下，使用 transform: translateZ(0); 可以改善动画或滚动的流畅度，因为它促使浏览器使用GPU（图形处理器）来渲染动画，这通常比仅使用CPU渲染更高效。

2. will-change: transform;

   • 这是一个CSS属性，用于通知浏览器该元素将来可能会有变换（如旋转、缩放、移动等）。
   • 它的目的是让浏览器预先优化，以便当这些变换发生时，动画可以更流畅地执行。
   • 但是，过度使用 will-change 可能会导致性能问题，因为它可能会让浏览器为很多元素保持优化状态，这可能消耗更多资源。

3. font-variant-numeric: tabular-nums; 是CSS中的一个属性，用于控制数字的字体变体。这个属性是font-variant的一部分，它提供了对字体内数字表示的更细粒度的控制。

   tabular-nums的作用：

   表格数字（Tabular Numbers）：使用tabular-nums会使文本中的数字以表格形式显示。这意味着所有数字都有相同的固定宽度，就像等宽字体中的字符一样。这对于对齐价格、时间和其他数字非常有用，特别是在表格和财务报表中。

user-select: none; 是 CSS 样式属性，用于禁用用户选择页面上的文本内容。当设置 user-select: none; 时，用户将无法选中、复制或高亮显示被应用该样式属性的元素内的文本。

.no-select {
  user-select: none;
}

选中文本颜色改变：

/* 全部选中的文本 */
::selection {
  background: #ffb7b7; /* 背景颜色 */
  color: #000; /* 文字颜色 */
}