Html 图像不'；t根据CSS代码的变化进行缩放

如何更改此代码，使其以70%的比例显示图像，并从四面获得30%的空白边距？我不想使用CSS背景属性，但想使用以下代码：

html:

---

首先，检查css选择器

#something

表示ID，

。something

表示类，

something

表示纯标记。此外，请记住用空格分隔它们

第二，你的数学：70%的宽度每边留15%，而不是30%

第三，只需设置图像的宽度和高度，并相应地调整顶部和左侧：

#bg

以在css中按id引用元素。另外，

10

必须有一个单元，例如，

10px

还不能很好地缩放，并且没有居中。为什么？它也是“#bg img”而不是“#bg.img”。选择器“#bg.img”将引用id为“bg”且类为“img”的an元素

<div id="bg"><img alt="" src="https://uwmadison.qualtrics.com/CP/Graphic.php?IM=IM_8qcNSb90kC6dqmx" /></div>

bg{
  position: fixed; 
  top: -50%; 
  left: -50%; 
  width: 70%; 
  height: 70%;
}
bg.img {
  position: absolute; 
  top: 10; 
  left: 10; 
  right: 10; 
  bottom: 10; 
  margin: auto; 
  min-width: 50%;
  min-height: 50%;
}