重置或覆盖用户代理样式表

Question

我正在使用SVG，由于某种原因，用户代理样式表将高度设置为289像素。

我不想定义高度，因为我将使用许多SVG（至少256个），并且不希望使用!important为每个SVG手动设置不同的css规则。

那么如何调整用户样式表（使用Chrome）或重置SVG！的高度字段，以便它没有定义？

示例SVG HTML :( SVG高度为25 px，但svg Bounding框呈现为289）

<div id="measure<%= measure.cid %>" class="measure">
  <svg xmlns="http://www.w3.org/2000/svg" version="1.1">
    <rect x="10" y="10" width="250" height="25" style="stroke:black; stroke-width:2; fill:lightgray;" />
    <div id="<%= beatHolder %>">
    </div>
  </svg> 
</div>

在尝试Alex W的答案时，我明白了：

Answer 1

您不能只将规则添加到样式表吗？

<style type="text/css">
 ...
svg { height: auto !important; }
</style>

您希望将该规则放在样式标记的最底部，以确保它具有优先权。

此外，在您的代码示例中，您似乎将rect设置为25像素，而不是实际的<svg>元素。

Answer 2

好的，在玩完你的例子后，我已经为你找到了答案。使用svg时，computed style height的{​​{1}}是从其父元素设置的，所以说你必须将svg置于具有width和{{的div中1}}所以我做了一个如何使用它的快速小例子，所以我们假设我们想要一个height作为徽标，然后一个用于横幅或我们将通过做{{{{ 1}}像这样，

<强> CSS

svg

<强> HTML

svg