我试图在打印时隐藏我的 SVG 中的某些元素。
在Chrome中,当我直接打开 svg 时,所有内容都会显示,当我打印预览时,我打算隐藏的内容通过@media print
. 但是,当我打开包含此 svg 的网页时(使用<img>
),打印预览会忽略打印媒体查询,并显示我打算隐藏的内容。
总之,将svg本身拖入Chrome,打印媒体查询工作,用svg打开网页,打印媒体查询不起作用。曲线球:IE9 正确实现了打印媒体查询。
关于为什么会发生这种情况的任何想法?
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="1352px" height="672px" viewBox="0 0 1352 672" enable-background="new 0 0 1352 672"
xml:space="preserve">
<defs>
<style type="text/css">@media print {#maroonBG {display:none;}}</style>
</defs>
<path id=maroonBG" fill="#722750" d="M1294.262,543.26c0,19.33-15.67,35-35,35H156.321c-19.33,0-35-15.67-35-35V137.784c0-19.33,15.67-35,35-35
h1102.941c19.33,0,35,15.67,35,35V543.26L1294.262,543.26z"/>
<rect x="81.785" y="176.636" fill="#0000ff" width="387.421" height="124.825"/>
</svg>