/* components/tabbar/tabbar.wxss */ .tabbar{ display: flex; justify-content: space-between; padding: 34rpx 74rpx 0; width: 750rpx; height: 166rpx; background: #fff; box-sizing: border-box; position: fixed; bottom: 0; left: 0; z-index: 999999999; box-shadow: 0rpx -6rpx 12rpx 2rpx rgba(0,0,0,0.09); border-radius: 32rpx 32rpx 0rpx 0rpx; } .tabbar .tabbar-item{ display: flex; flex-direction: column; align-items: center; justify-content: space-between; width: 76rpx; height: 76rpx; position: relative; } .tabbar .tabbar-item .num{ position: absolute; top: 0; left: calc(100% - 25rpx) ; /* width: 30rpx; */ height: 30rpx; padding: 0 10rpx; line-height: 30rpx; text-align: center; background: #FF4D3A; border-radius: 15rpx; font-size: 22rpx; color: #FFFFFF; } .tabbar .tabbar-item .icon{ width: 44rpx; height: 44rpx; } .tabbar .tabbar-item.pic-item .icon{ width: 76rpx; height: 76rpx; } .tabbar .tabbar-item .name{ font-size: 20rpx; color: #222222; } .tabbar .tabbar-item.active .name{ color: #006CE8; }