如何优化 CSS 样式？答案

【问题标题】：How to optimize CSS styles?如何优化 CSS 样式？
【发布时间】：2022-02-08 17:46:41
【问题描述】：

我需要使用属性 cursor:pointer 优化 CSS 样式一次。但是对于不同的情况有不同的规则。我该怎么做？请问各位大侠有什么想法吗？

    .product {
  &.grid .grid-product__text:not(._price),

  &.grid .grid-product__text._price,

  &.grid .grid-product__text .grid-product__text_inner {
    color: inherit !important;
  }

  &._photo-name-transition {
    ._name,
    ._image {
      cursor: pointer;
    }
  }

  &._name-transition {
    ._name {
      cursor: pointer;
    }
  }

  &._photo-transition {
    ._image {
      cursor: pointer;
    }
  }
}

【问题讨论】：

标签： css optimization styles

【解决方案1】：

如果我理解正确，您可以使用选择器 [class$="foo"] 来选择每个类以“foo”结尾的项目。

所以，就你而言，这是全球理念。

&[class$="-transition"] {
    ._name,
    ._image {
        cursor: pointer;
    }
}

如果你理解我指出的选择器，如果我的解决方案不完全正确，你应该能够优化你的代码，祝你好运！

更多信息在这里：https://www.w3schools.com/cssref/sel_attr_end.asp

【讨论】：