欢迎来到懒人模板!我们专注移动互联网,所有模板永久免费下载!
  • 首 页
  • 当前位置:主页 > 小程序教程 >

    微信小程序海鸥淘商品扫码首页设计制作开发教程(2)

    2018-07-17 09:45 来源/作者:懒人模板 分类:小程序教程  « »
     
    二、wxss样式文件代码如下:
    /**index.wxss**/
    .userinfo {
      display: flex;
      flex-direction: column;
      align-items: center;
    }
    .indexbanner{
    float: left;
       width: 100vw;
       height: 48.66666vw;
    
    }
    .indexsao{
     margin-top:50px;
     width: 290.5px;
     height: 44.5px;
    }
    .I{ font-size: 36rpx;margin-top:20px; color: #9A9A9A; line-height: }
    .I image{
      margin-top:10px;
      width: 15.5px;
      height: 15.5px;
    }
    .userinfo-avatar {
      width: 128rpx;
      height: 128rpx;
      margin: 20rpx;
      border-radius: 50%;
    }
    
    .userinfo-nickname {
      color: #aaa;
    }
    
    .usermotto {
      margin-top: 200px;
    }
    
    /*mask*/  
    .toast_mask {  
      opacity: 0;  
      width: 100%;  
      height: 100%;  
      overflow: hidden;  
      position: fixed;  
      top: 0;  
      left: 0;  
      z-index: 888;  
    }  
    /*toast*/  
    .toast_content_box {  
      display: flex;  
      width: 100%;  
      height: 100%;  
      justify-content: center;  
      align-items: center;  
      position: fixed;  
      z-index: 999;  
    }  
    .toast_content {  
      width: 50%;  
      padding: 20rpx;  
      background: rgba(0, 0, 0, 0.5);  
      border-radius: 20rpx;  
    }  
    .toast_content_text {  
      height: 100%;  
      width: 100%;  
      color: #fff;  
      font-size: 28rpx;  
      text-align: center;  
    }  
    .sys{
      justify-content: space-around;
    }
    .Iname{
      margin-top: -100px;
      margin-bottom: 64px;
      font-size: 48rpx; 
      color: #fff; 
    }
    .huojia{
    width: 290.5px;
     height: 125px;
     margin-top:20px;
    }

    点击扫描效果预览免费下载免登陆网盘下载
    标签:
    * 懒人模板承诺:本站所有资源免费下载,无病毒,无弹窗,无干扰链接! 提点建议