使用CSS缩小SVG

文章/答案/技术大牛

发布

1回答

image、svg、zooming、scale

我有一个纸飞机的SVG，我想把它放在一个圆圈里。但是，当我执行以下操作时，SVG在边缘处被裁剪。SVG的本质是可伸缩的，我尝试过摆弄SVG的属性，但问题仍然存在。我应该怎么做才能保留这个SVG？> <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink=&qu

浏览 16提问于2019-03-08得票数 1

回答已采纳

1回答

为什么在CSS中调整屏幕大小时，图像会缩小而不是移动？

html、css

下面是我的站点https://codepen.io/designextras/pen/GRoLNOx的代码现在，每当我缩小屏幕时，红色框(我的svg之一)会缩小，框svg也会缩小，所以它让我的svg我正在尝试复制这个网站的效果，当你缩小它https://clickup.com/ 请注意，当您调整渐变背景图像的大小时，它不会缩小，它只是移动，直到到达断裂点，然后转换为tab

浏览 41提问于2020-07-26得票数 0

1回答

我想要一个SVG注释随着容器的缩小而缩放。在滚动中，我的容器缩小它的高度(它的宽度保持不变)。该容器包含我想要的SVG注释变得可缩放，但其下半部分变为不可见/截断。如果我(通过CSS)使用我的SVG作为背景，我可以这样做，但我更喜欢将SVG内联到HTML中。我尝试使用SVG属性的各种值preserveAspectRatio..。我认为它的价值xMidYMin slice会切掉我的SVG的

浏览 64提问于2021-02-25得票数 1

回答已采纳

1回答

MVC4捆绑和base64 svg图像

c#、.net、css、asp.net-mvc、bundling-and-minification

当在css中使用嵌入式svg时，我遇到了一个Mvc4捆绑和缩小功能的问题。url("data:image/svg+xml;base64,PD94...当捆绑和缩小被禁用时，这可以很好地工作。但是，当它被启用时，该规则将被重写为： url("/content/style/data:image/svg+xml;base64,PD94...除了在独立文件中

浏览 0提问于2013-04-02得票数 3

回答已采纳

2回答

当使用svg-动画设置svg-text元素的CSS属性时，如何设置起始位置？

svg、svg-filters

我想使用svg-动画来动画一个svg-文本元素的CSS属性。我可以让动画工作得很好，但是CSS的起始位置是默认样式，而不是第一个关键帧的样式。>如果您修改上面的代码来设置svg-text元素

浏览 1提问于2014-11-30得票数 0

回答已采纳

1回答

XAML中的两个SVG元素显示不同的大小，尽管有相同的高度和宽度请求。

css、wpf、xaml、svg

我有以下XAML，在xamarin中使用插件来显示SVG文件。第二幅图像比第一幅大得多。我相信这与SVG文件的缩放有关吗？Facebook的第一个标签： <svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" xmlns:cc="

浏览 5提问于2016-01-09得票数 0

回答已采纳

2回答

svg图像在表中不能缩放

html、css、svg

我把一些svg图像放在一个表格里。但当浏览器调整大小时，它会缩小。</a></td> </tr> </table>和<

浏览 0提问于2013-09-10得票数 0

1回答

偏移路径的CSS媒体查询

html、css

.obj { width: 10px; left: 0px; }<svg_34">image/svg+xml</metadata> <metadata id="svg_117">

浏览 1提问于2021-06-12得票数 1

1回答

制作覆盖图像地图的更好方法？

javascript、jquery、html、imagemap

是否有更好的方法使用例如HTML5？或者任何其他HTML特性来实现这一点，而不必在photoshop中构建这些地图和图像覆盖？

浏览 2提问于2016-05-23得票数 0

回答已采纳

1回答

P:签名的较小显示

jsf、primefaces、digital-signature

根据的文章，基本原理很好，但是我正在尝试显示PrimeFaces p:signature，像下面这样的更小的：当我尝试简单地更改签名的width和height (在CSS中或直接类似于签名组件的属性SVG : 关于这个主题，我尝试过像这样显示生成的SVG：问题仍然一样，我不能调整SVG

浏览 3提问于2019-12-04得票数 2

回答已采纳

2回答

几行文本会使svg缩小

css、html、svg、flexbox

我正在尝试用flexbox创建带有svg + text的行，但我遇到了一个问题。代码如下：和css：下面是一个代码，所以你可以明白我所说的“收缩”是什么意思：<code>C2</code

浏览 43提问于2018-12-17得票数 1

回答已采纳

3回答

在Windows上滚动和缩放SVG查看器？

windows、image、browser、scroll、svg

我们需要查看一些非常大的(7200+像素)SVG。我发现的每一个SVG浏览器，包括现代的web浏览器，都不允许我们查看整个图像。没有任何滚动条，我们也没有缩放的选项。是否有开源/免费的应用程序可以帮助查看整个SVG图像？谢谢!

浏览 2提问于2009-09-23得票数 11

回答已采纳

2回答

具有流动宽度和固定高度的SVG图像(随页面拉伸/收缩，但保持高度不变)

html、css、svg

我有一个SVG图像，我正试图在我的页面中使用，我想要与页面拉伸。适用于非SVG图像的CSS不适用于SVG。在这里的快速小提琴中可以看到-> <img src="image.svg" id="topHeader">#topHeader {height: 46px;我已经尝试了不同的东西在我的CSS，但似乎不能得

浏览 2提问于2014-06-25得票数 3

2回答

css中的svg sprite -是变换缩放的合法方式

html、css、svg

我使用SVG雪碧图作为CSS背景图片，如下所示： background: url("../sprite/css-svg-sprite.svg") no-repeat; width: 32px;height: 32px;} 我唯一可以扩展它并按预期工作的

浏览 3提问于2016-04-11得票数 0

3回答

不需要base64编码的手写笔内联SVG数据uri

css、node.js、svg、stylus、data-uri

如何使用预处理器在CSS中嵌入SVG数据uri而不对SVG进行编码？background: url('data:image/svg+xml;utf8,<svg>[...]</svg>');background: url('data:image/svg+xml;base64,PD94bWwg[...]'); 诺马利我已经使用

浏览 0提问于2015-02-27得票数 6

回答已采纳

2回答

如何使用%统一缩放内联SVG

html、css、svg

我尝试在流体环境中使用SVG元素，使用%单位来设置与容器成比例的大小。如果包含SVG设计，如图像，则其工作方式与图像相同：您可以使用CSS轻松地按比例缩放它，如下所示：但如果你使用内联SVG

浏览 6提问于2014-03-19得票数 7

1回答

webpack构建中只裁减JS文件

webpack、uglifyjs、webpack-style-loader

process.env.NODE_ENV': JSON.stringify('production') new ExtractTextPlugin('style.cssinclude: path.join(__dirname, 'assets') { incl

浏览 4提问于2016-11-21得票数 2

1回答

CSS中的SVG，图像缩小

html、image、svg、resize

什么会导致图像(在本例中是svg)从html内部移动到它在css文件上的大小。我有一个位于背景上方的图像，当鼠标悬停在部分背景上时，我使用svg掩码显示底层背景图像。这很好用！但是，当我将css和javascript移动到它自己的文件中，而不是在同一个html文件中时，顶部的图像(在svg中)缩小到一个小的大小。任何关于这种情况发生的原因的帮助都将不胜感激！></body>这是CSS</

浏览 1提问于2015-01-03得票数 1

回答已采纳

1回答

如何显示img标记所在的SVG图像

css、svg

我得到一个SVG文件，其中包含以下内容(一个黑色的加号图标)： <!DOCTYPE svg PUBLIC "-//W3C//DTD

浏览 3提问于2016-08-17得票数 0

回答已采纳

1回答

如何负责任地定位图像？

html、css、position

在完全宽度，它的工作，它的位置正确，但当我缩小浏览器，它开始偏离对齐。你可以在下面的图片中看到我在说什么。全宽度：(浏览器在1920 px宽)在浏览器缩小后：(浏览器宽度为1400 px )HTML：(这个问题所需的最起码的html ) <ul> <img src="/images/footer_box.svg&quo

浏览 2提问于2016-08-23得票数 0

回答已采纳

点击加载更多