时间戳

首页 > 解决方案 > 如何在 SVG 中制作响应式 iframe

svg - 如何在 SVG 中制作响应式 iframe

问题描述

<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta charset="UTF-8" />
            <title>SVG Included with
                <object> tag</title>
    </head>
    <body>
        <object type="image/svg+xml" data="home.svg" id="global">
        </object>
    </body>
</html>


<?xml version="1.0" standalone="no"?>
    <svg  checksum="fa5cb5c38fd882d14b6b09f2c164ac3a4f0dbaef21d4cae1a02db8d7a30b3cd6" width="950px" height="599px" style="background:rgb(128,0,16)" 
    xmlns="http://www.w3.org/2000/svg" 
    xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" >
  <g>
    <foreignObject id="grafana1" xmlns="http://www.w3.org/2000/svg"  width="500" height="200" x="550" y="50" >
        <body xmlns="http://www.w3.org/1999/xhtml" >
            <iframeemphasized text xmlns="http://www.w3.org/1999/xhtml" width="500" height="200" src="https://play.grafana.org/d-solo/000000012/grafana-play-home?panelId=4&amp;orgId=1&amp;from=1533972607993&amp;to=1533973023514" frameborder="0"></iframe>
        </body>
    </foreignObject>
  </g>
</svg>

如果我们放大或缩小 HTML 页面，在这个 iframe 中是没有响应的。那么我怎样才能让它响应呢？

标签： svgiframeresponsive

解决方案

推荐阅读