如何调整bg图像和标签图像的高度?

时间:2014-10-01 10:12:22

标签: css css3 layout background background-image

如何调整bg图像和标签图像的高度?这是我需要的输出,这里是我需要调整导航的site。我尝试使用高度:[no.of px],但这不是我需要的输出。

当我尝试放大标签图像时,图像将溢出到bg图像。

1 个答案:

答案 0 :(得分:1)

我认为您需要将background-size属性应用于相关元素。

参见参考:http://www.w3.org/TR/css3-background/#the-background-size

此外,您可以使用简写表示法更加简洁地编写CSS规则, 也就是background属性。

您可能还需要应用background-clip属性。



div {
  border: 1px dotted blue;
  height: 150px;
  width: 450px;
  background-image: url(http://placekitten.com/1000/500);
  background-repeat: no-repeat;
  background-size: 100px 50px;
  background-position: 50px 50px;
}

<div>Sample text. Original image is 1000x500 px, but displayed as 100x50px.</div>
&#13;
&#13;
&#13;