小编典典

背景大小:100%100%;在Chrome中无法正常运行

css

我正在使用svg图像作为背景。我正在尝试使用CSS3,background-size: 100% 100%;但即使在应支持CSS3的浏览器(例如Chrome)中,它也似乎无法正常工作。

如果您查看此站点,将会看到#special-post article(在食物图片的右侧/下方)带有红色横幅背景的背景。请注意,当您缩小窗口时,背景图像的高度会下降以保持其比例,而不是像我想要的那样拉伸。

编辑:我在FireFox上检查了它,它可以正常工作…所以这似乎是一个webkit问题。

编辑:我在Safari上检查了它,它有效!因此,看来我的问题仅与Chrome有关。

(PS:我熟悉这个替代解决方案,使用img标签,但我宁可不使用它。)


阅读 336

收藏
2020-05-16

共1个答案

小编典典

解决方法:

打开.svg文件,<svg>在开始处找到标签,并在其中添加以下属性:

preserveAspectRatio="none"
2020-05-16