Question

我在css中使用这种方式定义了这个背景：

body{
background-image:url(BackgroundImage.jpg);
background-size: 100%;
background-repeat: no-repeat;

然后我在其中放置了几个其他图像放置在某些位置。像这样的例子：

#Logo{
position: absolute;
top:92px;
left:95px;
}

然而，我需要的是徽标图像相应地缩放到背景图像。

所以我想我需要告诉Logo图像你现在的尺寸是多少= 100％，每当我缩放窗口时你需要采取相应的行动。

提前做出任何贡献！

Answer 1

<body>
    <div id="logo"></div>
</body>

#logo {
  display: block;
  position: absolute;
  top:10%;
  left:5%;
  width: 15%;
  height: 18%;
  background-image: url(logo.jpg);
  background-size: cover;
  background-position: center center;
}

https://jsfiddle.net/michaelyuen/h2am5zkg/

您需要以百分比

设置所有内容

根据背景图像重新缩放图像。

1 个答案: