标签：flex color list item tabs 源码 外卖 霸王餐 friends

外卖霸王餐小程序、H5、微信公众号版外系统源码|霸王餐美团/饿了么系统 粉丝裂变玩

2021最新外卖霸王餐小程序、H5、微信公众号版外系统源码|霸王餐美团/饿了么系统 粉丝裂变玩源码下载

2021外卖cps小程序项目|外卖红包cps带好友返利佣金分销系统程序|饿了么美团联盟源码

外卖cps带分销返利源码

源代码地址

https://gitee.com/caonima008/coupon/

成品展示

截图

步骤

• 下载以上源代码到本地
  https://gitee.com/caonima008/coupon/
• 修改为你自己的微信小程序，打开 /dist/pages/ele/index.js
  
• 微信小程序->开发管理->开发设置 添加 request的域名： 地址：
  https://mp.weixin.qq.com/wxamp/devprofile/get_profile?token=271531762&lang=zh_CN
  
• 小程序管理后台配置你的链接
  后台地址： http://q.mybei.cn
• 进去之后选择小程序管理->无裂变小程序管理->添加小程序->填入你自己的链接
  
• 微信开发者工具，导入项目，提交审核
  

.friends .nav_bar_tabs {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.friends .nav_bar_tabs .item {
  color: #fff;
  font-size: 32rpx;
  width: 116rpx;
  padding: 12rpx 0;
}

.friends .nav_bar_tabs .item .title {
  padding: 8rpx 0;
  border-bottom: 6rpx solid transparent;
}
.empty{
  display: flex;
  justify-content: center;
  color: #999;
}

.empty_text{
  margin-top: 20%;;
}
.friends .nav_bar_tabs .item.active {
  font-weight: 600;
}

.friends .nav_bar_tabs .item.active .title {
  border-color: #fff;
}

.friends .tabs_wrapper .placeholder {
  height: 80rpx;
}

.friends .tabs {
  background-color: #fff;
}

.friends .tabs .fixed {
  position: fixed;
  width: 100%;
  z-index: 1;
}

.friends .tabs,.friends .tabs .item {
  display: -ms-flexbox;
  display: flex;
}

.friends .tabs .item {
  height: 80rpx;
  width: 50%;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-size: 26rpx;
  color: #333;
  border-bottom: 1rpx solid #eee;
  box-sizing: border-box;
}

.friends .tabs .active {
  color: #f01614;
  border-color: #f01614;
}

.friends .count {
  font-size: 24rpx;
  color: #999;
  margin-top: 18rpx;
  height: 72rpx;
  line-height: 72rpx;
  padding: 0 18rpx;
  background-color: #fff;
  border-bottom: 1rpx solid #eee;
}

.friends .count .red {
  color: #f01614;
  padding: 0 3rpx;
}

.friends .list {
  height: 100%;
}

.friends .list .header {
  background-color: #fff;
  border-bottom: 1rpx solid #eee;
}

.friends .list .header .text {
  width: 50%;
  height: 80rpx;
  line-height: 80rpx;
  color: #333;
  text-align: center;
  font-size: 26rpx;
}

.friends .list .header,.friends .list .item,.friends .list .item .left {
  display: -ms-flexbox;
  display: flex;
}

.friends .list .item {
  background-color: #fff;
  border-bottom: 1rpx solid #eee;
  padding: 18rpx;
}

.friends .list .item .left {
  width: 60%;
}

.friends .list .item .left .avatar {
  width: 84rpx;
  height: 84rpx;
}

.friends .list .item .left .flex,.friends .list .item .right {
  display: -ms-flexbox;
  display: flex;
  flex-direction: column;
  -ms-flex-pack: distribute;
  justify-content: space-around;
}

.friends .list .item .left .flex {
  margin-left: 16rpx;
}

.friends .list .item .left .flex .name {
  color: #333;
  font-size: 26rpx;
}

.friends .list .item .left .flex .id {
  color: #888;
  font-size: 24rpx;
}

.friends .list .item .right {
  width: 40%;
}

.friends .list .item .right .info {
  color: #999;
  font-size: 24rpx;
}

.friends .list .item .right .info .red {
  color: #f01614;
}

.friends .list .item .right .info .ml6 {
  margin-left: 6rpx;
}

标签：flex,color,list,item,tabs,源码,外卖,霸王餐,friends
来源： https://blog.csdn.net/waimai_cps/article/details/115062067

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。