Question

我正在使用具有预定义类（cbFormFieldCell）的CMS。因此，我无法更改某些类元素，因为它们已在网站的其他部分使用。如果我更改该类每个元素的格式，则网站将损坏。

我只想在<table class="tabelle">内更改类“ cbFormFieldCell”的样式。在表格外，其他元素可能不会更改。

.cbFormFieldCell { min-width: 300px; max-width: 300px; overflow: hidden;}

适用于网站的每个类别。但是有些物体坏了。

是否可以做这样的事情：

仅更改表class =“ tabelle”中的预定义class =“ cbFormFieldCell”元素吗？

例如

.tabelle.cbFormFieldCell 
{ min-width: 300px; max-width: 300px; overflow: hidden; }

有人可以帮忙吗？

Answer 1

您可以像这样使用css！important

.cbFormFieldCell { min-width: 300px !important; max-width: 300px !important; overflow: hidden !important;}

“！important”使css属性成为第一级

Answer 2

您正在通过不带空格的方式编写类的级联，这基本上意味着 .tabelle.cbFormFieldCell将应用于具有两者这些类的元素。

为了定位.cbFormFieldCell，在{strong> .tabelle内添加.tabelle .cbFormFieldCell这样的空格。

或者如果它是.tabelle的直接子代，则可以使用类似.tabelle > .cbFormFieldCell的后代选择器

Answer 3

CSS类之间的“空格”用于定位不同的元素。在下面，您将找到一个示例，当您组合不带空格或带空格的类时会发生什么情况。

希望这可以帮助您了解如何定位元素。

.parent-1 .child {
  color: green;
}

.parent-2.child {
  color: red;
}


/* addition styling */

p {
  padding: 20px;
  background-color: #eff0f1;
  border-radius: 10px;
}

<!-- Without container -->
<p class="child">No CSS rules are applied here.</p>

<!-- With containers -->
<div class="parent-1">
  <p class="child">This will be targeted: green</p>
</div>

<div class="parent-2">
  <p class="child">No CSS rules are applied here.</p>
</div>


<div class="parent-2 child">
  <p class="child">This will be targeted: red</p>
</div>

Answer 4

谢谢大家！

我实际上不得不删除空间，使用重要的东西，并另外使用另一个默认类。

.cbFormTableEvenRow .cbFormFieldCell {min-width：100px！important; max-width：100px！important;宽度：100px！重要;溢出：隐藏！重要}

仅在表格内设置班级样式

4 个答案: