CSS:如何控制页脚中SVG的大小

Question

我是 CSS 的新手，继承了以下代码，为打印的文档添加页脚

@page {
  @bottom-right {
    content: counter(page) "("counter(pages)")";
    border-top:1mm #00a7d1 solid;
    width:100%;
  }

  @bottom-left {
    content: url(logo.jpg);
  }
}

我要改logo.jpg成为 SVG 图像。只需更改 URL 即可，但生成的图形会跨越页面的整个宽度。

在样式表的另一部分，可以像这样控制 SVG 的大小:

#logo {
  position:absolute;
  height:auto;
  width:52mm;
}

但是，width 的设置值或 height里面@bottom-left没有效果。如何从 @page 中控制 SVG 的大小规则？

---

编辑: 这是 <svg>根元素

<svg
   xmlns:dc="http://purl.org/dc/elements/1.1/"
   xmlns:cc="http://creativecommons.org/ns#"
   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
   xmlns:svg="http://www.w3.org/2000/svg"
   xmlns="http://www.w3.org/2000/svg"
   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
   width="233.21152mm"
   height="72.102554mm"
   viewBox="0 0 826.34002 255.48149"
   id="svg2"
   version="1.1"
   inkscape:version="0.91 r13725"
   sodipodi:docname="logo.svg">

Answer 1

我认为您不能直接在 margin at-rule 中设置大小.它由 @page 中的配置决定。虽然我没有使用过分页媒体规则，所以我不能 100% 确定这一点。

但是尝试将 SVG 中的 width 和 height 从它们当前的固定大小值(“233mm”等)更改为 “100%”。它应该允许 SVG Logo 正确缩放。