3

这是我试图解决的一个困难。我正在客户页面内开发滚动界面。基本上，我无法更改文档类型、周围元素以及已经在客户端页面中的样式表或脚本，我必须让我的小代码块“适合”其中。这对于 Web 开发人员来说很常见。现在棘手的部分是我的块中的一些 img 元素实际上被继承的客户端样式表中的 CSS 规则定位（当然，我不能删除或更改）。解释为什么在这种情况下我实际上不能自己使用更具体的 CSS 规则来弥补这一点太长了，但这是事实。所以我的问题是：除了创建另一个规则或删除规则之外，有没有办法防止 HTML 元素成为 CSS 规则的目标？困难在于像这样的规则

.containter1 .containter3 { ... }

将针对内部的一个元素：

<div class="container1">
   <div class="containter2">
      <div class="containter3">Element
      ...

页面内的元素不会为 CSS 规则制造“墙”，这些规则会“跳过”容器以到达目标元素。所以像这样的规则

img { ... }

将针对任何 img 标签。我知道弥补这一点的唯一方法是创建一个更具体的 CSS 规则，针对要保护的精确 img。但我不能在这里这样做。有没有办法在不创建 CSS 规则的情况下仅通过添加 HTML 来获得相同的结果？

/ * 编辑澄清* /

我知道 CSS 规则、特异性、继承等。我的问题更务实。考虑这个例子来澄清问题：假设您有一个您无法触摸的客户样式表，它定义了以下一般规则：

img { display:none; }

问题是您不能设置相应的通用规则来做相反的事情，例如：

img { display:not-none; }

因为没有对立面这样的事情。的反义词"none"可以是"inline", "block", "inline-block", 等等。

所以基本上，这意味着第一个通用规则会强制您为页面中display的每一个明确定义属性img。这很糟糕。所以我试图找到一个破解方法来解决这样的情况（我的实际问题比这更糟糕，相信我，但这个例子更清晰，更容易解释）。

4

4 回答 4

2

如果您说要在不更改任何代码的情况下阻止定位，那么不，这显然是不可能的。

内联样式总是覆盖样式表规则（除非它们使用!important标签，否则您也需要使用它）。

您应该能够使用您最喜欢的 CSS 重置中的语法重置您需要的任何元素。以下是一些选项：

http://www.cssreset.com/

所以，像 -

<div style="border:0 !important;padding:0 !important;margin:0 !important;height:auto;"></div>

是你最好的选择。

于 2012-11-15T16:27:31.073 回答
0

元素的默认display值为。如果要重置所有图像的显示值，为什么不使用它呢？imginline-block

如果您有多种不同类型的元素被设置为奇怪的值，那么问题可能会更复杂一些，因为您需要考虑将哪些元素设置为什么显示类型。但是所有的 HTML 元素都有明确定义的默认显示类型，因此将它们全部重置应该不会太难。

img {display: inline-block;}
span, a, etc {display:inline;}
div, etc {display:block;}
... etc ...

如果归根结底，您可以只使用可用的重置 CSS 脚本之一，将所有内容设置回正确的默认值。

于 2013-04-26T12:30:54.303 回答
0

您可以更改特定元素的 CSS 的唯一方法是修改现有样式或创建更具体的新样式并将重载其他样式。

我必须让我的小代码块“适合”其中。

一旦你做了一些代码块，你可以像这样将样式标签放在那个 HTML 代码块中，例如：

<div id="block_of_code_available_for_modification">
   <style type="text/css">
       //css code which will fix styles of your content without influencing other elements on a page.
   </style>
</div>

或者，如果你只有几个元素需要修改样式，你可以使用styleHTML 元素的属性（一旦你可以设置修改 HTML，你总是可以添加类似下面的东西......好吧，与添加样式标签相同） . style 属性中的 css 属性的优先级最高。除非!important在某些先前的样式中没有：

<img style="any css properties you need" src="..." />
于 2012-11-15T16:26:53.333 回答
0

不，您无法阻止其他规则应用于特定元素。您必须为该 html 元素重新定义所有这些规则，以便它们将覆盖所有其他规则。

于 2014-02-04T11:58:53.287 回答