Question

我正在尝试将图像添加到离子内容中，基本上作为顶部横幅，但是有一些讨厌的填充，它会自动添加到它下面，我似乎无法删除。代码是：

<ion-view>
  <ion-content>
    <img src="http://impact.byu.edu/style/wide_banner6.gif" style="width:100%; padding:0px">
    <div class="list">
      <div class="item item-divider"> 
        Settings
      </div>
    </div>
  </ion-content>
</ion-view>

这个codepen演示了我所说的https://codepen.io/anon/pen/LkvObV。我想删除图像底部和“设置”项目分隔符之间的间距。谁知道怎么样？我尝试在css中使用填充/边距属性没有成功。

Answer 1

将display: block;应用于img代码并查看魔术！

说明：

默认情况下，图像是内嵌呈现的，就像文本一样。默认情况下，所有内联块元素都有一些垂直对齐值 - 通过应用vertical-align: top重置它或通过应用display: block重置显示属性

无法移除图像离子下方的填充

1 个答案: