Question

我正在检查第三方CSS文件，我遇到的是同一个属性设置多次但每次都有不同值的类。我无法弄清楚为什么会这样，有人可以对此有所了解吗？

以下示例：

.tabulator .tabulator-header .tabulator-col {
  display: inline-block;
  position: relative;
  box-sizing: border-box;
  border-right: 1px solid #aaa;
  background: #e6e6e6;
  text-align: left;
  vertical-align: bottom;
  overflow: hidden;
}

.tabulator .tabulator-row .tabulator-cell {
  display: inline-block;
  position: relative;
  box-sizing: border-box;
  padding: 4px;
  border-right: 1px solid #aaa;
  vertical-align: middle;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

Answer 1

.tabulator .tabulator-header .tabulator-col{} - 表示这些CSS设置应用于任何位于元素.tabulator-col内并且位于元素tabulator-header内的类tabulator的HTML元素

所以根据你的问题，两种风格都不同。

这里是选择器https://www.w3schools.com/cssref/css_selectors.asp

的文档

如果两个选择器具有相同的特异性，则最后一个选择器将获胜。

为什么同一个类的冲突属性？

1 个答案: