hhred/pages/applic/appliSystem.vue

<template>
	<view class="content">
		<view class="box">
			<view class="box-1">
				<navigator url="/pages/applic/toknowledge">
					<view class="img">
						<image src="../../static/img/ack.png" mode=""></image>
					</view>
					<view class="title">
						造血干细胞-相关知识
					</view>
				</navigator>
			</view>
			
			<view class="box-1">
				<navigator url="/pages/applic/know">
					<view class="img">
						<image src="../../static/img/timg01.jpeg"></image>
					</view>
					<view class="title">
						捐献造血干细胞你了解多少？
					</view>
				</navigator>		
			</view>
			
			<view class="box-1">
				<navigator url="/pages/applic/applic">
					<view class="img">
						<image src="../../static/img/spread.png"></image>
					</view>
					<view class="title">
						造血干细胞入库申请表
					</view>
				</navigator>	
			</view>
			
		</view>
	</view>
</template>

<script>
	export default{
		methods:{
			// uni.navigateTo({
			// 	url: url
			// })
		}
	}
</script>

<style lang="scss">
	.content{
		background-color: #F8F8F8;
		padding-bottom: 44rpx;
		.box{
			padding: 0 24rpx;
			.box-1{
				margin-top: 24rpx;
				width: 100%;
				height: 442rpx;
				background-color: #FFFFFF;
				border-radius: 16rpx;
				.img{
				width: 100%;
				height: 300rpx;
				// border-radius: 16rpx 16rpx 0 0;
					image{
						border-radius: 16rpx 16rpx 0 0;
						width: 100%;
						
						height: 300rpx;
					}
				}
				.title{
					height: 142rpx;
					padding-left: 24rpx;
					line-height: 142rpx;
					font-size: 34rpx;
				}
				a{
					text-decoration: none;
					color: #333;
				}
			}
		}
	}
</style>