css图片拉伸不重复 |css按钮隐藏域

例如，下面的代码中，背景图片会被拉伸至覆盖整个元素的背景，但是图片会重复填充，导致背景出现了多个重复的花瓣。

div {
background-image: url('flower.jpg');
background-repeat: repeat;
background-size: 100% 100%;
}

为了实现拉伸图片而不重复填充的效果，大家可以使用background-repeat属性的值为no-repeat。

div {
background-image: url('flower.jpg');
background-repeat: no-repeat;
background-size: 100% 100%;
}

这样大家就可以实现拉伸图片而不重复的背景效果了。除了使用100%作为background-size的值以外，大家还可以使用具体的像素数值来控制背景图片的大小。

div {
background-image: url('flower.jpg');
background-repeat: no-repeat;
background-size: 800px 600px;
}

在使用具体像素数值时，大家需要注意保持图片的宽高比，以避免拉伸后图片变形。