Fatal编程技术网
  • css/
  • 使用CSS随意调整图像大小？

使用CSS随意调整图像大小？

css image

使用CSS随意调整图像大小？,css,image,resize,height,width,Css,Image,Resize,Height,Width,我试图调整背景图像的大小，使其保留其父元素（文本区域）100%的高度和宽度。我希望图像能够动态调整和更改纵横比，就像文本区域一样。我有下面的CSS，html只是一个textarea标记 textarea { margin-left: 50px; margin-top: 50px; width: 500px; height: 100px; background: url(http://gfx9.com/images/contents/b/e/beautiful-cartoon-landscapes

我试图调整背景图像的大小，使其保留其父元素（文本区域）100%的高度和宽度。我希望图像能够动态调整和更改纵横比，就像文本区域一样。我有下面的CSS，html只是一个textarea标记

textarea {
margin-left: 50px;
margin-top: 50px;
width: 500px;
height: 100px;
background: url(http://gfx9.com/images/contents/b/e/beautiful-cartoon-landscapes-vector-set-14-free0.jpg) no-repeat;
background-size:100%;
border-radius: 5px
}

使用这段代码，图像水平调整大小，但我希望它水平和垂直调整大小，填充区域中的所有空白

希望有人能想出一个解决方案。

您需要指定两个值，因为现在它只捕获第一个值（即宽度）。像这样：

div{
背景大小：100%100%；
}
如果需要具体说明，也可以使用
px
。此外，还有另一个名为
cover
的值，它将背景图像缩放为尽可能大的大小。

背景大小：cover或
背景大小：100%100%不适用于封面，图像溢出该区域，但100%100%适用。我不知道您可以为背景大小指定两个值。感谢您提供的快速解决方案。@devqon请将您的建议添加为答案，以便SoKeT能够选择它作为正确答案。欢迎使用StackOverflow！您可能不知道，当您有多行代码时，可以将其显示为带有语法高亮显示的代码块，而不是内联代码。有关更多信息，请参阅。