CSS 内联类的优先级不正确

Question

如果您查看这个CssToInlineStyles类。它本质上是试图让 CSS 全部内联。然而，当涉及到已经内联的 CSS 被样式块中的定义覆盖时，它的优先级完全错误！

我认为在 第 312 行 我需要添加一个条件确保已经存在的内联样式永远不会被 CSS 属性中的任何定义覆盖。但看来事情并没有那么容易！

有什么想法吗？我尝试联系班主任，但没有回复。如果我解决了这个问题，我将在 github 上提出拉取请求。

更新

如果样式块中有以下内容：

p{font-family:Arial;font-size:0.9em;color:#53534a;} 
.webv {font-size: 10px; padding:5px 0 0 150px}

那么如果您有像这样的 ap 标记：

<p class="webv" >Testing</p>

那么类 .webv 需要根据 font-size 生效。

更新 2

Hakre 的解决方案运行良好，但有一种情况不起作用。例如，如果你有这个样式块：

  *{padding:0;margin:0;}
  h1{padding-bottom:10px;}

h1 的填充仍然是 0，第二个 h1 不会接管它应该接管的！所以它看起来像这样：

<h1 style="padding:0; margin:0;">Test</h1>

Answer 1

幸运的是，这个类的所有者已经解决了这个问题！更新后的类可以在此处找到。

Answer 2

如果您不想覆盖它们，您首先需要从 HTML 源获取现有属性。

然后，您可以在设置新值之前检查是否已设置这些值以防止覆盖，或者稍后将它们覆盖为默认值。

由于之前已经提取了现有属性，因此它的工作方式可能是：（

foreach($rule['properties'] as $key => $value)
    if(!isset($properties[$key])) $properties[$key] = $value;

这将覆盖 NULL 属性，如果出现问题，请使用 array_key_exists 而不是 isset）。

您应该向类/函数添加一个标志来更改行为，这样当前的行为就不会中断，但您可以将您的需求设为可选。

编辑：由于可以应用多个规则，下一个规则不会覆盖上一个规则的某些内容（它应该但被上面的编辑阻止），因此这需要更多的控制来保留原始属性：

$originalProperties = $properties;
foreach($rule['properties'] as $key => $value) $properties[$key] = $value;
$properties = $originalProperties + $properties;

编辑2：第二个建议也不会起作用。基本上需要获取非常原始的值，因为该函数在迭代规则和元素时会更改样式属性。同一元素可以修改两次，因此 $originalProperties 并不是真正的原始属性，而是可以修改的属性。

也许这适用于 spl_object_hash为每个元素创建一致的 id/key，但我不确定。也许 DomElement 在内部提供了类似的东西，但我还没有找到这样的东西（应该更适合）。每个具体元素都有一个特定的键/id，只有在第一次出现时，才能保留非常原始的属性：

$elementId = spl_object_hash($element);
if(!isset($originalProperties[$elementId]))
{
    $originalProperties[$elementId] = $properties;
    $originalElements[$elementId] = $element; // Needed to make spl_object_hash work
}
foreach($rule['properties'] as $key => $value) $properties[$key] = $value;
$properties = $originalProperties[$elementId] + $properties;

Answer 3

您可以在 CSS 定义后使用 !important 以确保其优先。

例如

.yourstyle
{
    color: #000 !important;
}