newTianLi/components/introduce/introduce.vue

<template>
	<!-- 组件名称 -->
	
	<view class="aboutUs">
		<text>地址：浙江省台州市路桥区路北街道珠光街199号 213室 (环飞龙湖科创生态圈首聚地)</text>
		<view class="betWeen">
			<text>电脑：0576-82528889</text>
			<text>邮箱：163312@qq.com</text>
			<text>邮编：318050</text>
		</view>
		<text>备案号：浙ICP备2021004458号</text>
		<view class="erweima">
			<view class="img">
				<image src="../../static/img/erweima.png" mode=""></image>
			</view>
			<text>扫一扫关注我们</text>
		</view>
	</view>
</template>

<script>
	export default {
	//定义一个对象
	props:{
		aboutUs:Object
	},
	//(是在用到这个组件时的页面这样做) 如果有data数据，封装，需要在上放html中声明一下  例：data{1,2,3,45}   html：<view :data = "data"></view>
	}
</script>
<style lang="scss">
	.aboutUs {
		position: relative;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 132rpx;
		background: #127FD5;

		text {
			font-size: 14rpx;
			font-family: Adobe Heiti Std;
			font-weight: normal;
			color: #FFFFFF;

		}

		.between {
			display: flex;
			justify-content: space-around;

			text {
				font-size: 14rpx;
				font-family: Adobe Heiti Std;
				font-weight: normal;
				color: #FFFFFF;
			}
		}

		.erweima {
			position: absolute;
			right: 10rpx;
			bottom: 5rpx;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;

			.img {
				width: 56rpx;
				height: 52rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}

			text {
				font-size: 12rpx;
				font-family: Adobe Heiti Std;
				font-weight: normal;
				color: #FFFFFF;

			}
		}
	}
</style>