你好，我不能让我的svg占据整个屏幕的宽度！不管它们是否扭曲，因为这个使用的想法是一种变形来改变我的页面的背景颜色
下面是我CSS：
.container {
height: 5000px; /* hauteur de la page */
}
.img {
width: 100%;
height: 100vh;
object-fit: fill;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
transition: opacity 0s ease-in-out;
opacity: 0;
}
.img.transition {
transition: opacity 0s ease-in-out;
}
.img.active {
opacity: 1;
}完整的代码如下：codepen
谢谢
1条答案
按热度按时间6jjcrrmo1#
我想在svg中加入
viewBox参数可能会有帮助。第三和第四个数字给予它的相对宽度和高度。在下面的例子中，给出了100%的宽x高。查看更多信息-〉https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/viewBox
同样，你不能对HTML节点和SVG节点使用相同的CSS属性。不幸的是，像
object-fit，margin，position等属性在SVG元素上不起作用。更多信息请点击此处-〉https://css-tricks.com/svg-properties-and-css/