Question

所以，我正在做一些事情，我正在尝试创建一个位于另一个div内的图像标记。问题是，我写了

.container {
  padding: 0;
  margin: 0;
}

.container img {

  padding: 0px;
  margin: 0px;
  width: 100%;
  height: 100%;

}

<div class='container'>

  <img src='https://www.clarkson.edu/_site_support/background_image_banks/images/tor_images/studcnt_4128800003.jpg' alt='A problem occured'>

</div>

但是在边缘之前还有一些空间。我还尝试将填充设置为0，将边距设置为0，但仍然没有。

Answer 1

将身体边距设为0px;

body {
   margin: 0px;
}

Answer 2

在css中使用重置文件或结构将值设置为定义的默认值，而不是让浏览器得到它。我使用的其中一个重置文件来自http://meyerweb.com/eric/tools/css/reset/。在这种情况下，主体的边距为8px，由于没有定义框大小，因此会影响宽度。试试吧。

Answer 3

试试此代码

body,html{
margin:0px;
padding:0px;
}

Answer 4

设置float属性以摆脱额外的空间：

div img { float: left }

但是关于图像的大小，您需要记住，如果div的宽度/高度设置为百分比，则内部元素的宽度/高度不能设置为百分比。 / p>

如果您想以百分比设置图像宽度/高度，则需要指定div的尺寸（以像素为单位）。

E.g。

这有效：

div {
    width: 600px;
    height: 400px;
}
div img {
    width: 100%;
    height: 100%;
}

但这不起作用：

div {
    width: 100%;
    height: 100%;
}
div img {
    width: 100%;
    height: 100%;
}

总而言之，你需要处理问题的两个部分是这样的：

div {
    width: 100%;
    height: 100%;
}
img {
    float: left; /* or right, whatever you'd rather */
    display: block;
}

但是，为了更好的建议，需要有关div容器的信息。

最大化img的大小

4 个答案: