微信小程序授权页面

这里也是比较简单的

直接复制粘贴就可以用,可能图片位置不对。。

<template> <view id="imporwer"> <image src="../static/image/people.jpg" ></image> <view class="title">课程点评</view> <view class="t1">您尚未登陆</view> <view class="t2">需要获取您的授权后进入商城</view> <view class="b1" @tap="notUp">暂不登录</view> <view class="b2" >立即登陆 <button class=\'testbutton\' open-type="getUserInfo" @getuserinfo="getuserinfo" withCredentials="true"></button></view> </view> </template> <style lang="scss" scoped> #imporwer{ position: fixed; left: 0;top: 0; width: 100%;height: 100%; background: #ededed; letter-spacing: 1px; color: #7b7b7b; display: flex; align-items: center; flex-direction: column; image{ width: 220rpx;height: 220rpx; border-radius: 50%;margin: 80rpx 0 40rpx 0; } .title{ font-size: 35rpx;color: #3a3a3a; } .t2,.t1{ font-size: 29rpx; } .t1{ margin-top: 40rpx; } .b1{ margin: 100rpx 0 40rpx 0; background-color: #acabab; } .b2{ background-color:#009944; position: relative; .testbutton{ position: absolute; top: 0;left: 0; width: 100%; height: 100%; opacity: 0; } color: #FFFFFF; } .b1,.b2{ text-align: center;line-height: 85rpx; width: 420rpx;height: 85rpx;border-radius: 40rpx; font-size: 37rpx; } } </style>

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/zwggjx.html