相关疑难解决方法(0)

如何缩放嵌入<object>标签的顽固SVG?

我有一些指定SVG文件widthheight以及viewbox这样的:

<svg width="576pt" height="432pt" viewBox="0 0 576 432" > ...
Run Code Online (Sandbox Code Playgroud)

但是如何在浏览器中以我决定的大小显示它们?我希望它们更小,并尝试过:

<object width="400" data="image.svg"></object>
Run Code Online (Sandbox Code Playgroud)

但后来我得到了可见的滚动条.

如果我改变SVG文件设置它的工作原理width,并height100%相反,但我想决定在HTML的大小,无论在SVG文件中使用什么尺寸.这可能吗 ?

html svg

112
推荐指数
6
解决办法
9万
查看次数

响应式 svg 在 safari 中没有全宽

我有一个 svg,它应该是身体的 100% 宽度,它在 ie11、chrome 和 firefox 中工作 - 但在 safari 中,svg 的两侧都有一些空间,我无法摆脱它。任何帮助表示赞赏 - 请参阅此处的小提琴:http : //jsfiddle.net/tbbtester/2apEh/

css:

body{margin:0;padding:0;background:orange;}
.top {position: absolute;width: 100%;}
.inner{height:0;position: relative;padding-top:3.2%;}
svg{height: 100%;display:block;width: 100%;position: absolute;top:0;left:0;}
rect{stroke:none;fill:teal;}
Run Code Online (Sandbox Code Playgroud)

标记:

    <div class="top">
        <div class="inner">
            <svg viewBox='0 0 100 3.2' preserveAspectRatio="xMidYMid meet">
                <rect x="0" y="0" height="3.2" width="100"/>
            </svg>
        </div>
    </div>
Run Code Online (Sandbox Code Playgroud)

html css safari svg

6
推荐指数
1
解决办法
3603
查看次数

如何用css更改svg rect的宽度

可以用CSS改变SVG矩形的宽度吗?

这不起作用:

#red {
    width: 800px;
}
#red:hover {
    width: 1600px;
}
Run Code Online (Sandbox Code Playgroud)

jsfiddle.

css svg css3 svg-animate

1
推荐指数
2
解决办法
8564
查看次数

标签 统计

svg ×3

css ×2

html ×2

css3 ×1

safari ×1

svg-animate ×1