Question

我刚刚开始创建的页面中的横幅出现了这个问题。我是html的初学者，在这里找不到任何类似的问题，如果以前已经回答了这个问题，那么现在好了。我的样式表上有这个：

{{1}}

从这个我认为横幅img应该是900px或者和它的父div一样大但是由于某种原因，横幅仍然比身体小20-30 px并且当我将其宽度设置为900px而不是100 ％图像有点对齐并离开身体。在此先感谢您的帮助

Answer 1

如果要完全包含图像，请尝试以下操作：

android:listSelector="#333333"

但请注意，正文与客户端设置的尺寸相同，因此宽度不一定是900px。

Answer 2

你只需要将它添加到你的CSS中，问题就会得到解决

#banner{
  margin:0;
}

Answer 3

您不能在body标签上设置100％以外的宽度，因为您无法控制用户浏览器窗口的宽度。如果900px必须是您的内容的宽度，那么尝试在所有其他内容周围的body标签后添加div标签，如下所示：

<body>
<div class="wrapper">
<figure id="banner">
    <img src="" />
</figure>
</div>
</body>

然后使用这个css：

body {
    width: 100%;
    background-attachment:fixed;
    background-size: cover;
    background-position: center;
    background-image: url(images/seagull-sunset2.jpg);
}

.wrapper {
    width: 96%;
    max-width: 900px;
    margin: 0 auto;
}

您的内容最大宽度将达到900像素，无论其像素宽度是否小于900像素，您身体上的图像都会根据浏览器窗口的宽度调整大小。图片将自动填充可用空间。

此外，当浏览器窗口宽度小于900px时，封装器的96％宽度将确保您的内容位于浏览器窗口的中间，左右边距为2％。

同样设置你的img css：

#banner img {
    width: 100% !important;
    height: auto !important;
}

这将确保图像的大小适合横幅的整个宽度，同时也不会被压扁。

图像的大小不应该是HTML / CSS

3 个答案: