覆盖CSS样式？

Question

我在 Stack Overflow 上搜索了一下，没有找到解决方案。我知道如果已经存在样式，可以通过更改其属性来覆盖它。但现在我需要覆盖一种奇怪的样式。

以下是我的一个例子：

首先，我有这个：

.slikezamenjanje img{
    max-width: 100%;
    max-height:150px;
    padding-right:7px;
}

现在我需要用这个样式来覆盖之前的样式:

#zoomTarget .slikezamenjanje img {
    max-width: 100%;
}

问题在于第一个样式会附加到第二个样式上，但我不希望这样。在第二个样式中，我需要的只是一行，而不是从第一个样式附加过来。

- Miomir Dancevic

---

这个班级的名字真是够震撼的。 - dthree

Answer 1

而不是覆盖原有元素，您可以向该元素添加另一个类，从而获得额外的能力。

例如：

HTML

<div class="style1 style2"></div>

CSS

//only style for the first stylesheet
.style1 {
   width: 100%;      
}
//only style for second stylesheet
.style2 {
   width: 50%;     
}
//override all
.style1.style2 { 
   width: 70%;
}

- Dvir

---

在第一种样式中，我得到了什么？什么都没有。而在第二种样式中，我需要将max-height:150px;和padding-right:7px;覆盖为NOTHING！ - Miomir Dancevic

现在我明白你了，Gorostas，请看看我的帖子。 - dthree

也许可以尝试给元素添加另一个类，然后再使用 CSS，而不是覆盖 CSS。 - Dvir

Answer 2

你只需要将不想要的值重置为它们的默认值即可。没必要使用!important来避免混乱。

#zoomTarget .slikezamenjanje img {
    max-height: auto;
    padding-right: 0px;
}

帽子制作

我认为你缺少的关键数据是CSS有默认值。如果你想要覆盖一个值，可以将它设置回默认值，你可以查阅一下。

例如，所有CSS的height和width属性默认为auto。

- dthree

---

这个 max-width: 100%; 的问题还存在吗？ - Miomir Dancevic

你不应该需要使用 !important，因为 #zoomTarget .slikezamenjanje img 比 .slikezamenjanje img 更加具体。 - cjd82187