zhongwin/components/ubottom.vue

<template>
	<view class="contact">
		<view class="contact-title">
			<text class="text"></text>
			<text class="zy">粟珈依安</text>
			<text class="text"></text>
		</view>
		<!-- <view class="contact-content">
			<view class="img">
				<image src="../static/img/phone.png" mode=""></image>
			</view>
			<view class="phone">
				专线电话：18252757278
			</view>
		</view> -->
	</view>
</template>

<script>
	export default {
		name:"u-bottom",
		data() {
			return {
				
			};
		}
	}
</script>

<style lang="scss">
	.contact {
			
			width: 100%;
			height: 100rpx;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			.contact-title {
				display: flex;
				align-items: center;
				.text {
					margin: 0 20rpx;
					width: 270rpx;
					height: 2rpx;
					background: #E5E5E5;
				}
				.zy{
					font-size: 30rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #999999;
					line-height: 42rpx;
				}
			}

			.contact-content {
				display: flex;
				align-items: center;
				
				.img {
					margin: 0 5rpx;
					width: 28rpx;
					height: 28rpx;
					image {
						width: 100%;
						height: 100%;
					}
				}

				.phone {
					font-size: 26rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #999999;
					line-height: 42rpx;
				}
			}
		}
</style>