pages/index/xingshan/less.less

@@ -0,0 +1,195 @@
+@h1:100rpx;
+
+page{
+	width: 100%;
+	height: 100%;
+	background-color: #f7f6f2;
+	margin: 0;
+	padding: 0;
+}
+.nav{
+	width: 100%;
+	height: @h1;
+	background-color: #ff8359;
+	color: #fff;
+	font-size: 45rpx;
+	font-weight: 600;
+	.back{
+		height: @h1;
+		width: 15%;
+		position: absolute;
+		text-align: center;
+		text{
+			line-height: @h1;
+		}
+	}
+	.text{
+		position: absolute;
+		height: @h1;
+		width: 70%;
+		left: 15%;
+		text{
+			line-height: @h1;
+		}
+	}
+	.menu{
+		position: absolute;
+		width: 15%;
+		height: @h1;
+		left: 85%;
+		image{
+			height: @h1;
+			width: 100%;
+		}
+	}
+}
+
+.slideshow{
+	background-color: #fff;
+	width: 100%;
+	height: 27vh;
+	padding-top: 2vh;
+	.banner{
+		width: 100%;
+		height: 25vh;
+		image{
+			margin-left: 3%;
+			width: 94%;
+			height: 25vh;
+			border-radius: 20rpx;
+		}
+	}
+}
+
+@h2:350rpx;
+.content{
+	margin-top: 15rpx;
+		width: 100%;
+		height: @h2;
+		background-color:#f7f6f2;
+		.content1{
+			width: 100%;
+			height:100rpx;
+			background-color: #FFFFFF;
+			text:nth-child(1){
+				font-size: 45rpx;
+				font-weight: 600;
+				line-height: 100rpx;
+				margin-left: 3%;
+			}
+			text:nth-child(2){
+				color: #727272;
+				float: right;
+				line-height: 100rpx;
+				margin-right: 3%;
+			}
+		}
+		.content2{
+			position: relative;
+			width: 100%;
+			border-top: 5rpx solid #cccccc;
+			height: 220rpx;
+			background-color: #fff;
+			text:nth-child(1){
+				font-size: 35rpx;
+				display: block;
+				width: 65%;
+				height: 120rpx;
+				margin-top: 10rpx;
+				padding-left: 20rpx;
+			}
+			text:nth-child(2){
+				font-size: 28rpx;
+				color: #a9a9a9;
+				margin-left: 20rpx;
+			}
+			image{
+				position: absolute;
+				width: 200rpx;
+				height: 170rpx;
+				top:20rpx;
+				right: 20rpx;
+				border-radius: 20rpx;
+			}
+		}
+}
+@h3:100rpx;
+.rank{
+	width: 100%;
+	margin-top: -10rpx;
+	background-color: #fff;
+	.rankTitle{
+		width: 100%;
+		height: 80rpx;
+		text{
+			line-height: 80rpx;
+			font-size: 40rpx;
+			margin: 3%;		
+		}
+	}
+	.rankContent{
+		position: relative;
+		border-top: 5rpx solid #ccc;
+		width: 94%;
+		height: 150rpx;
+		background-color: #FFFFFF;
+		margin-left: 3%;
+		.photo{
+			position: absolute;
+			width: @h3;
+			height: @h3;
+			top: 25rpx;
+			image{
+				width: @h3;
+				height: @h3;
+				border-radius: 20rpx;
+			}
+		}
+		.rankText{
+			position: absolute;
+			width: 60%;
+			height: @h3;
+			background-color: #18B566;
+			left: @h3+20rpx;
+			margin-top: 25rpx;
+			color: #000000;
+			text:nth-child(1){
+				position: absolute;
+				font-weight: 550;
+				font-size: 38rpx;
+				display: block;
+				margin-top: 0;
+				top: 0;
+			}
+			text:nth-child(2){
+				font-size: 30rpx;
+				display: block;
+				position: absolute;
+				bottom: 0;
+			}
+		}
+		.rankTime{
+			position: absolute;
+			width: @h3;
+			height: @h3;
+		}
+	}
+}
+.btn{
+	top: 100%;
+	position: fixed;
+	width: 100%;
+	height: 100rpx;
+	background-color:#ccad52;
+	transform: translateY(-100%);
+	.btnText{
+		position: absolute;
+		line-height: 100rpx;
+		font-weight: 500;
+		font-size: 42rpx;
+		color: #fff;
+		margin-left: 50%;
+		transform: translateX(-50%);
+	}
+	
+}