Question

我无法获得媒体查询以影响以下内容。我需要svg对象更改为高度：100％@media（max-width：767px）

<object type="image/svg+xml" data="img/5/image.svg"></object>

    <style type="text/css">
    body {
        overflow: hidden;
    }
    object {
        position: absolute;
        top: 0px;
        bottom: 0px;
        left: 0px;
        right: 0px;
        width: 100%;
        height: auto;
    }

</style>

Answer 1

我有同样的问题，我注意到在我将object标记添加到我的页面后，第一次加载时页面解析出现了错误，我仍然没有找到解释，但是您可以使用以下标记之一而不是object的平均时间。

使用<embed>代码

 <embed type="image/svg+xml" src="image.svg"/>

在<iframe>

内

 <iframe src="image.svg"/>

使用<img>代码

<img src="image.svg"/>

使用CSS背景图片

#myelement
{
    background-image: url(image.svg);
}

在以前的标签中加载SVG的优点和缺点可以在这篇伟大的文章中找到：How to Add Scalable Vector Graphics to Your Web Page作者Craig Buckler

快乐的编码：）

媒体查询不会影响对象

1 个答案: