3***@qq.com
3***@qq.com
  • 发布:2019-05-21 16:33
  • 更新:2022-06-07 15:48
  • 阅读:7612

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

分类:uni-app
2019-05-21 16:33 负责人:无 分享
已邀请:
9***@qq.com

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

4***@qq.com

是图片本身的边距吧?

啊明

啊明

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

9***@qq.com

9***@qq.com

nvue 没有
vue安卓部分手机有

9***@qq.com

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

同问,这个有解决方案吗

n***@qq.com

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

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

b***@foxmail.com

b***@foxmail.com

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

烟花

烟花

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

1***@qq.com

1***@qq.com

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

uni-image{
display:inline-block;
}

6***@qq.com

6***@qq.com

解决方法:

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

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

Potter

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%;
}
}

无效呀

i锦鲤

i锦鲤 - -接单-Tel:18560000860

把图片的font-size设置成0

该问题目前已经被锁定, 无法添加新回复