微信小程序 获取 元素的宽高

一,主要介绍   圆头像不变形的 写法 ,默认图片是一个长方形的图片

头像改变前      后续美化后

步骤一:  

<view class="brokerimg">

 <image  style='height:{{height}}' src="{{brokerlist.brokerimg}}"   bindload="imageGao" />

</view>

步骤二:

  

步骤三:

.broker_head .brokerimg{width:146rpx;height:146rpx;overflow: hidden;border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%;margin:0 auto;}

.brokerimg image{width: 100%;border:none;height:auto;}

.homebtn{width:90rpx;height:90rpx;background:#fecf20;border-radius:50%;bottom:50rpx;right:25rpx;-moz-box-shadow: #f6efd8 0px 0px 10px 5px ;

box-shadow: #f6efd8 0px 0px 10px 5px ;}

.homebtn text{text-align: center;line-height:90rpx;color:#fff;font-size:26rpx;display: block}

         返回首页按钮 写了投影效果

技术 支持 四 :  文字之间加多个空格

需要加   decode="{{true}}"    ,然后在后面写 &nbsp;&nbsp;  或者  &ensp;&ensp;

<text class='headinfo' decode="{{true}}">业务类型:{{brokerlist.btype}} &nbsp;&nbsp;|&nbsp;&nbsp; 从业年限:{{brokerlist.nx==null?'0':brokerlist.nx}}年</text>

猜你喜欢

转载自blog.csdn.net/weixin_41883384/article/details/81115346
今日推荐