JiKeBang
JiKeBang
  • 发布:2019-01-07 12:58
  • 更新:2022-10-15 19:01
  • 阅读:4630

nvue image图片为什么无法圆角?

分类:nvue

错误写法:
<image style="width:500px;height:500px;border-radius: 250px;" src="https://img-cdn-qiniu.dcloud.net.cn/new-page/uni.png"></image>

已实现:
<div >
<div class="imgbox">
<image class="img" src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1546848052660&di=666aa07edcf3791f957b9a249ba908cb&imgtype=0&src=http%3A%2F%2Fimg.zcool.cn%2Fcommunity%2F01ef4a55448bed0000019ae9d0edff.jpg"></image>
</div>
</div>

<style >
.imgbox{
width:500px;
height:500px;
border-radius:999px;
background-clip:padding-box;
border-top-left-radius: 999px; / 左上角 /
border-top-right-radius: 999px; / 右上角 /
border-bottom-right-radius: 999px; / 右下角 /
border-bottom-left-radius: 999px; / 左下角 /
}
.img{
width:500px;
height:500px;
}
</style>

2019-01-07 12:58 负责人:无 分享
已邀请:
Trust

Trust - 少说废话

weex 的规范,只能是挨个声明。。。

3***@qq.com

3***@qq.com - 1

给图片加个div层级,设置div圆角,图片100%,我这边都是这样设置的

t***@163.com

t***@163.com - 80后

<div style="border-radius:50;"><image style="width: 60px;height: 60px;" v-if="data.avatar" :src="data.avatar"></image></div>
nicepainkiller

nicepainkiller - 最爱 dcloud

不要用百分百 要用数值

<image src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595840599227&di=13ddd6bfa43a8a7b39ba045ae8f035bc&imgtype=0&src=http%3A%2F%2Fmedia-cdn.tripadvisor.com%2Fmedia%2Fphoto-s%2F07%2F96%2Faf%2F8a%2Ftup-island.jpg"
style="width: 124rpx;height:124rpx; border-top-right-radius:63rpx; border-bottom-left-radius: 63rpx;border-bottom-right-radius: 63rpx;border-top-left-radius: 63rpx;
border-width:8rpx; border-style:solid;border-color:#007AFF"
mode=""></image>

FullStack

FullStack - 【插件开发】【专治疑难杂症】【ios上架、马甲包、白包、过审、已成功上架过几百个】【多款插件已上架:https://ext.dcloud.net.cn/publisher?id=22130】【非诚勿扰】QQ:543610866

玄清真人

玄清真人

一瞎眼就过去了

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