使用fragments时,SVG图像的尺寸出现问题。当我设置为background-size: cover
时,图像不会覆盖容器中的可用空间。
这里是demo。
是否可以使用SVG片段,并且能够以适当的行为使用contain
中的cover
和background-size
?
问题是您没有指定父级SVG的宽度和高度。 Chrome浏览器存在一个错误,该错误要求为片段指定高度和宽度以处理与img相关的CSS技术,但不确定信息的来源是什么,但是CSS Tricks记录了该错误here。我认为高度和宽度仅需要在use标签所在的父级SVG中指定。
您可以在这里看到在sprite.svg中设置svg标签的高度和宽度会在两个版本之间提供统一的行为。