Question

为什么div区域仍比图像css大？

<div style="padding: 0px 0px;display: inline-table;background: red;">
            <img src="http://static.adzerk.net/Advertisers/3ce23fa868ea401dac7e2fcfda5ec312.png" style="height: 70px;padding: 0;margin: 0; ">
        </div>

https://i.stack.imgur.com/WHDU3.jpg

如何设置div区域以适合图像？

Answer 1

IMG - 是内联元素，因此它的行为与块类型元素不同。您可以通过将display设置为block

来覆盖它

如果您为div替换“inline-table”代表“inline-block”并为display:block设置img - 一切都会好的。 this answer on SO

中有一个很好的描述

Answer 2

现在好吗？

设置图片的宽度。

body,html{
  width:100%;
  height:100%;
  margin: 0! important;
  padding : 0! important;
  }
img{
  width:100%;
  height:100%;
  }
div{
  width:100%;
  height:20%;
  }

<div style="padding: 0px 0px;display: inline-table;background: red;">
            <img src="http://static.adzerk.net/Advertisers/3ce23fa868ea401dac7e2fcfda5ec312.png" style="padding: 0;margin: 0; ">
        </div>

Answer 3

更改div中的样式，这对我有用。

<div style="display: inline-table; width: auto; height: auto;">
    <img src="http://static.adzerk.net/Advertisers/3ce23fa868ea401dac7e2fcfda5ec312.png" style="height: 70px;padding: 0;margin: 0;">
</div>

Answer 4

你需要设置div的宽度和高度，并且内部img设置100％的宽度和高度。

我现在更新了代码检查 https://fiddle.jshell.net/xktb8wsL/4/

Answer 5

添加到图像样式=＆＃34;显示：块;＆＃34;

＆＃13;

<div style="padding: 0px 0px;display: inline-table;background: red;">
    <img style="display:block;" src="http://static.adzerk.net/Advertisers/3ce23fa868ea401dac7e2fcfda5ec312.png" style="height: 70px;padding: 0;margin: 0;">
 </div>

＆＃13;

Answer 6

使用img标签使用Css vertical-align middle; width：100％;

＆＃13;

<div style="padding: 0px 0px;display: inline-table;background: red;">
        <img src="http://static.adzerk.net/Advertisers/3ce23fa868ea401dac7e2fcfda5ec312.png" style="height: 70px;padding: 0;margin:0;
vertical-align: middle; width: 100%; ">
</div>

＆＃13;

<div style="padding: 0px 0px;display: inline-table;background: red;">
        <img src="http://static.adzerk.net/Advertisers/3ce23fa868ea401dac7e2fcfda5ec312.png" style="height: 70px;padding: 0;margin: 0;vertical-align: middle;width: 100%; ">
</div>

＆＃13;

为什么div区域仍然比图像css更大？

6 个答案: