uniapp image 存在上下边距，怎么去除

9***@qq.com - 95后小萌新

同问，就是有空白不是 margin 也不是padding

1***@qq.com

这个是uniapp自定义元素标签uni-image。为了和原生image标签属性，采用了display:inline-block;属性导致的，在需要去除边框的时候就OK了。

uni-image{

display:inline-block;

}

2020-11-11 18:52

4***@qq.com

是图片本身的边距吧？

啊明

这个问题你解决了吗请教一下

9***@qq.com

nvue 没有
vue安卓部分手机有

9***@qq.com - 加班中。。

同问，这个有解决方案吗

n***@qq.com - https://lichengwu.net

去掉mode属性，例如 mode="aspectFit" 就有上下边距问题

b***@foxmail.com

我是再给image标签再给一个display:block样式就可以了

烟花

多张图片之间有间距，就在css图片image标签上上加个display:block属性，就能消除默认边距

1***@qq.com

这个是uniapp自定义元素标签uni-image。为了和原生image标签属性，采用了display:inline-block;属性导致的，在需要去除边框的时候就OK了。

uni-image{
display:inline-block;
}

6***@qq.com

解决方法：

           <image> 外面<view>加一个 line-height=0

原理详情参考 https://www.cnblogs.com/coderleon/p/img_and_line-height.html

Potter

    <view class="item__icon">  
        <image src="@/static/svgs/a-zu11005.svg"></image>  
        </view>

.item__icon {
width: 64rpx;
height: 100%;
position: absolute;
top: 0;
right: 0;
line-height: 0;
image {
display: block;
width: 100%;
height: 100%;
}
}

无效呀

大貔貅_接单 - 接单-解决各种疑难杂症@Tel_18560000860

把图片的font-size设置成0

uniapp image 存在上下边距，怎么去除

12 个回复

公告

相关问题

uniapp image 存在上下边距，怎么去除

与内容相关的链接

12 个回复

公告

相关问题