/* custom-tab-bar/tabBar.wxss */ .tab-bar { position: fixed; bottom: 0; left: 0; right: 0; height: 50px; background: #fff; display: flex; line-height: 1.2; padding: 10rpx 0; padding-bottom: env(safe-area-inset-bottom); } .tab-bar-item { flex: 1; text-align: center; display: flex; justify-content: center; align-items: center; flex-direction: column; } .tab-bar-item .image { width: 26px; height: 26px; } .tab-bar-item .tab-bar-view { font-size: 12px; margin-top: 4px; } .bulge { background-color: #FFF; } .bulge .tab-bar-bulge{ position: absolute; z-index: -1; width: 64px; height: 64px; top: -24px; border-radius: 50%; background-color: #FFF; } .bulge .image{ position: absolute; width: 50px; height: 50px; top: -20px; } .bulge .tab-bar-view{ position: relative; bottom: -16px; margin-top: 4px; }