page{ width: 100%; height: 100%; } .box{ width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; position: relative; } map{ width: 100%; height: 100%; position: relative; display: flex; flex-direction: column; align-items: center; } .search{ width: 90%; display: flex; z-index: 999; align-items: center; background: #fff; height: 80rpx; margin: 0 auto; justify-content: center; position: fixed; top: 40rpx; border-radius: 10rpx; } .search .place{ font-size: 26rpx; color: #707070; } .search input{ width: 75%; height: 100%; font-size: 26rpx; color: #707070; } .list{ width: 90%; z-index: 999; background: #fff; position: fixed; top: 140rpx; overflow-y: auto; border-radius: 10rpx; height: 1008rpx; } .list image{ width: 32rpx; height: 32rpx; margin-top: 16rpx; } .city_list{ display: flex; align-items: center; width: 82%; font-size: 26rpx; justify-content: space-around; padding: 16rpx 0rpx; border-bottom: 2rpx solid #E8E8E8; margin-right: 26rpx; margin: 0 auto; } .city_list view{ display: flex; flex-direction: column; overflow: hidden; width: 90%; } .city_list view .title1{ font-size: 21rpx; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: #989898; } .city_list view .title{ font-size: 25rpx; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: black; padding-top: 14rpx; } .city_list:last-of-type{ border: none; } .parking{ position: fixed; bottom: 0rpx; width: 100%; left: 0rpx; height: 270rpx; background: #fff; z-index: 999; -webkit-transform:translateY(100%); transform:translateY(100%); display: flex; align-items: center; justify-content: space-around; } .background{ width: 100%; height: 100%; position: fixed; z-index: 888; background: #989898; opacity: 0.5; } .parking .view{ display: flex; flex-direction: column; } .parking .view1{ width: 65%; display: flex; padding-left: 25rpx; } .parking .view2{ width: 20%; font-size: 24rpx; color: #989898; align-items: center; justify-content: center; } .parking .view1 view{ width: 100%; font-size: 24rpx; color: #989898; padding-top: 20rpx; } .parking .view1 .title{ font-size: 30rpx; color: black; } .coverImage{ position: absolute; top: 50%; left: 50%; z-index: 999; } .bottom image{ width: 18px; margin: 3px 2px; height: 20px; } .bottom{ width: 80%; display: flex; align-items: center; justify-content: space-around; position: fixed; bottom: 30rpx; left: 10%; background: white; padding: 15rpx 0rpx; border-radius: 10rpx; } .bottom .view{ display: flex; flex-direction: column; align-items: center; font-size: 26rpx; } .bottom .view text{ padding-top: 10rpx; } .bottom .view .bikeBorder{ width: 24px; height: 28px; border: #0000FF 2rpx solid; background: #C0D2EF; box-sizing: border-box; } .parkBorder{ width: 24px; height: 28px; border: #FF00FF 2rpx solid; background: #FF00FF66; box-sizing: border-box; } .noPark{ width: 24px; height: 28px; border: #FF0000 2rpx solid; background: #FF000030; box-sizing: border-box; }