html - SVG 的加载方式取决于我访问网页的方式

标签 html css url svg

所以我有这个网页,我将 SVG 设置为缩放到其父 div(position:absolute)的宽度的 100%,当我从它存储的目录中打开它时,它很好;然而,当我从它在互联网上的 url 打开它时,它看起来都放大了,并且有滚动条来“导航”大 svg 图像。

#titlebar   {
    top:0px;
    width: 100%;
    height: auto;
}

当从文件驱动器(例如 file:///T:/public_html/...)访问时,此代码使 SVG 缩小到父 div 的宽度,但会生成滚动条并使 SVG 大小与原始大小保持一致, 并且在通过其 url 访问时有滚动条来导航它。

最佳答案

您应该尝试将 viewBox 属性添加到您要包含的 SVG 中。 它通常用于根据父宽度和高度缩放 ​​SVG。 阅读此内容以获取更多信息:https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/viewBox

关于html - SVG 的加载方式取决于我访问网页的方式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31348590/

相关文章:

iphone - 应用内评论链接

html - 是否可以相对于另一个 CSS 类(不是外部类)来设置 CSS 类的样式?

html - css - 显示 : table-cell and fixed width

css - 我确实想使用具有斜 Angular 效果的 css 设计如下图所示的东西

javascript - 在灯箱上打印图像

css - 尝试将按钮 float 到右侧时出现意外行为

c# - 我需要一个正则表达式来将字符串转换为 anchor 标记以用作超链接

url - 二维码中 URL 后面的额外文本

javascript - 在输入文本框中输入字符后移动到新页面

html - CSS - DIV 对齐问题