为什么我的图像在其他属性正常工作时没有调整大小？

Question

我一直在尝试在以下代码中调整此图像的大小。我试过 px、em、% 并将单位类型留空，但它不会调整大小。我已经尝试了宽度和高度，但都没有改变。 CSS 中的其他属性工作正常：边距、位置等。为什么图片不调整大小？

非常感谢您花时间阅读本文并提出建议。

下面的代码

HTML

    <div id='fixed-button'>

        <a href='main-home-timeline.html'>
          <img src='images/im-lost-clock.png'>
        </a>

        </div>

The CSS

    #fixed-button {
  position: fixed;
  width: 10;
  padding: 0;
  margin-top: 120px;
  margin-left: 600px;
}

Answer 1

您必须为 img 元素添加 width and/or height 属性，即您为 img 定义一个 class 然后在其中添加 width: 10px ，或者使用选择器 #fixed-button a img

#fixed-button a img {
    width: 10px;
}

Answer 2

如果您打算更改父级，您的图像需要 width: 100%;，这样它才能跟随它。或显式更改图像宽度：

#fixed-button img {
 width: 100px;
}

Answer 3

只需将Width属性修改为100px即可解决当前问题

#fixed-button {
  position: fixed;
  width: 100px;
  padding: 0;
  margin-top: 120px;
  margin-left: 600px;
}

希望对您有所帮助...

Answer 4

您正在调整 div 元素而非图像元素的大小。正确代码如下。

CSS

.fixed-button {
position: fixed;
width: 10px;
padding: 0px;
margin-top: 120px;
margin-left: 600px;
}
.img1 {
position: fixed;
width: 10px;
padding: 0px;
margin-top: 120px;
margin-left: 600px;
}

HTML

<div id="fixed-button" class="fixed-button">
<a href="main-home-timeline.html">
<img src="images/im-lost-clock.png" id="img1" class="img1" />
</a>
</div>

为什么我的图像在其他属性正常工作时没有调整大小？

Why is my image not resizing when other attributes are working fine?

html

css

image-resizing

下面的代码