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元素添加宽度和/或高度属性，即您为img定义一个类，然后将宽度：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>

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

以下代码

4 个答案: