Преглед изворни кода

证书查询 和 文章查看 px转rem

xionghaojie пре 3 година
родитељ
комит
4d0ecbd664

+ 135 - 164
pages/certificateDetail/certificateDetail.css

@@ -1,193 +1,164 @@
 .project {
-	height: 70px;
-	line-height: 70px;
-	background: #1AA1E6;
-	font-size: 24px;
-	color: #FFFFFF;
-	font-weight: bold;
-}
-
-.project-content {
-	margin: 30px 0;
-	justify-content: center;
-	align-items: stretch;
+     height: 0.7rem;
+     line-height: 0.7rem;
+     background: #1AA1E6;
+     font-size: 0.24rem;
+     color: #FFFFFF;
+     font-weight: bold;
+}
+ .project-content {
+     margin: 0.3rem 0;
+     justify-content: center;
+     align-items: stretch;
 }
-
 /* 考试 */
-.test-box {
-	width: 890px;
-	/* min-height: 812px; */
-	background: #FFFFFF;
-	border-radius: 0px 0px 0px 0px;
-	opacity: 1;
-	border: 3px solid #FFFFFF;
-	position: relative;
-	padding: 30px;
-	box-sizing: border-box;
+ .test-box {
+     width: 8.9rem;
+    /* min-height: 8.12rem;
+     */
+     background: #FFFFFF;
+     border-radius: 0rem 0rem 0rem 0rem;
+     opacity: 1;
+     border: 0.03rem solid #FFFFFF;
+     position: relative;
+     padding: 0.3rem;
+     box-sizing: border-box;
 }
-
-.test-title {
-	font-size: 18px;
-	font-family: Source Han Sans CN-Bold, Source Han Sans CN;
-	font-weight: bold;
-	color: #1AA1E6;
-	line-height: 36px;
-	text-align: center;
+ .test-title {
+     font-size: 0.18rem;
+     font-family: Source Han Sans CN-Bold, Source Han Sans CN;
+     font-weight: bold;
+     color: #1AA1E6;
+     line-height: 0.36rem;
+     text-align: center;
 }
-
-.table {
-	font-size: 16px;
-	align-items: flex-start;
-	margin-top: 30px;
+ .table {
+     font-size: 0.16rem;
+     align-items: flex-start;
+     margin-top: 0.3rem;
 }
-
-.border {
-	border: 1px solid #DEDEDE;
+ .border {
+     border: 0.01rem solid #DEDEDE;
 }
-
-.border-left {
-	border-left: 1px solid #DEDEDE;
+ .border-left {
+     border-left: 0.01rem solid #DEDEDE;
 }
-
-.border-left-none {
-	border-left: none;
+ .border-left-none {
+     border-left: none;
 }
-
-.border-right {
-	border-right: 1px solid #DEDEDE;
+ .border-right {
+     border-right: 0.01rem solid #DEDEDE;
 }
-
-.border-right-none {
-	border-right: none;
+ .border-right-none {
+     border-right: none;
 }
-
-.border-bottom {
-	border-bottom: 1px solid #DEDEDE;
+ .border-bottom {
+     border-bottom: 0.01rem solid #DEDEDE;
 }
-
-.border-bottom-none {
-	border-bottom: none;
+ .border-bottom-none {
+     border-bottom: none;
 }
-
-.border-top {
-	border-top: 1px solid #DEDEDE;
+ .border-top {
+     border-top: 0.01rem solid #DEDEDE;
 }
-.border-top-none {
-	border-top: none;
+ .border-top-none {
+     border-top: none;
 }
-
-.padding-left {
-	padding-left: 10px
+ .padding-left {
+     padding-left: 0.1rem 
 }
-
-.height56 {
-	height: 56px;
-	box-sizing: border-box;
+ .height56 {
+     height: 0.56rem;
+     box-sizing: border-box;
 }
-
-.width140 {
-	width: 140px;
-	box-sizing: border-box;
+ .width140 {
+     width: 1.4rem;
+     box-sizing: border-box;
 }
-
-.width200 {
-	width: 200px;
-	box-sizing: border-box;
+ .width200 {
+     width: 2rem;
+     box-sizing: border-box;
 }
-
-.text-center {
-	text-align: center;
+ .text-center {
+     text-align: center;
 }
-
-.ddflex-jc {
-	display: flex;
-	align-items: center;
-	justify-content: center;
+ .ddflex-jc {
+     display: flex;
+     align-items: center;
+     justify-content: center;
 }
-
-.bg-color {
-	background: #F5F5F5;
+ .bg-color {
+     background: #F5F5F5;
 }
-
-.test-info {
-	width: 280px;
-	flex-direction: column;
-	margin-left: 30px;
+ .test-info {
+     width: 2.8rem;
+     flex-direction: column;
+     margin-left: 0.3rem;
 }
-
 /* 考试信息 */
-.test-people {
-	width: 100%;
-	background-color: #FFFFFF;
-	padding: 12px 11px;
-	box-sizing: border-box;
-}
-
-.test-people image {
-	width: 80px;
-	height: 89px;
-	margin-right: 19px;
+ .test-people {
+     width: 100%;
+     background-color: #FFFFFF;
+     padding: 0.12rem 0.11rem;
+     box-sizing: border-box;
+}
+ .test-people image {
+     width: 0.8rem;
+     height: 0.89rem;
+     margin-right: 0.19rem;
+}
+ .test-people-info {
+     flex-direction: column;
+     justify-content: space-between;
+     font-size: 0.14rem;
+     flex: 1;
+     align-items: flex-start;
+}
+ .test-people-label {
+     color: #999999;
+     line-height: 0.36rem;
+     margin-right: 0.08rem;
 }
-
-.test-people-info {
-	flex-direction: column;
-	justify-content: space-between;
-	font-size: 14px;
-	flex: 1;
-	align-items: flex-start;
-}
-
-.test-people-label {
-	color: #999999;
-	line-height: 36px;
-	margin-right: 8px;
-}
-
 /* 考试公告 */
-.note-box {
-	width: 100%;
-	background-color: #FFFFFF;
-	padding: 20px;
-	box-sizing: border-box;
-	margin-top: 20px;
-}
-
-.note-title {
-	margin-bottom: 18px;
-	font-size: 16px;
-}
-
-.note-title-icon {
-	width: 18px;
-	height: 18px;
-	margin-right: 10px;
-}
-
-.note-item {
-	justify-content: space-between;
-	font-size: 12px;
-	font-weight: 400;
-	line-height: 30px;
-	font-family: Source Han Sans CN-Regular, Source Han Sans CN;
-	cursor: pointer;
-}
-
-.note-item-content {
-	color: #666666;
-	flex: 1;
-	overflow: hidden;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-	margin-right: 10px;
-}
-
-.note-item-content:hover {
-	text-decoration: underline #666666;
-}
-
-.note-item-date {
-	color: #999999;
-}
+ .note-box {
+     width: 100%;
+     background-color: #FFFFFF;
+     padding: 0.2rem;
+     box-sizing: border-box;
+     margin-top: 0.2rem;
+}
+ .note-title {
+     margin-bottom: 0.18rem;
+     font-size: 0.16rem;
+}
+ .note-title-icon {
+     width: 0.18rem;
+     height: 0.18rem;
+     margin-right: 0.1rem;
+}
+ .note-item {
+     justify-content: space-between;
+     font-size: 0.12rem;
+     font-weight: 400;
+     line-height: 0.3rem;
+     font-family: Source Han Sans CN-Regular, Source Han Sans CN;
+     cursor: pointer;
+}
+ .note-item-content {
+     color: #666666;
+     flex: 1;
+     overflow: hidden;
+     text-overflow: ellipsis;
+     white-space: nowrap;
+     margin-right: 0.1rem;
+}
+ .note-item-content:hover {
+     text-decoration: underline #666666;
+}
+ .note-item-date {
+     color: #999999;
+}
+ 
 
 
 /* 移动端 */

+ 22 - 1
pages/certificateDetail/certificateDetail.vue

@@ -1,4 +1,5 @@
 <template>
+	<page-meta :root-font-size="fontsize+'px'" style="display: block;">
 	<view  v-if="isPc">
 		<Headers></Headers>
 		<view class="project">
@@ -164,6 +165,7 @@
 			</uni-popup>
 		</view>
 	</view>
+	</page-meta>
 </template>
 
 
@@ -180,11 +182,30 @@
 				info:{},
 				isPc:true,
 				
-				systemInfo:{}
+				systemInfo:{},
+				fontsize:'100px'
 			}
 		},
 		onReady() {},
 		onLoad() {
+			let srceenNunber = 19.2; //因设计图是1920所有把设计图分为19.2份,所以html字体大小为100px
+			    let that = this;
+			
+			    //窗体改变大小触发事件
+			    uni.onWindowResize((res) => {
+			        console.log('变化后的窗口宽度=', res.size.windowWidth);
+			        that.fontsize = parseFloat(res.size.windowWidth) / srceenNunber;
+			    })
+			
+			    //打开获取屏幕大小
+			    uni.getSystemInfo({
+			        success(res) {
+			            console.log('设备信息:', res);
+			            that.fontsize = res.screenWidth / srceenNunber;
+			            console.log('字体大小:', that.fontsize);
+			        }
+			    })
+			
 			this.systemInfo = uni.getSystemInfoSync()
 			this.isPc = this.IsPC()
 			if(!req.getStorage('options')){

+ 71 - 73
pages/certificateQuery/certificateQuery.css

@@ -1,77 +1,75 @@
 .top-bg {
-	width: 100%;
-	z-index: 1;
-}
-
-.bottom_bg {
-	width: 100%;
-	position: fixed;
-	bottom: 50px;
-}
-
-.content-box {
-	z-index: 1;
-	justify-content: center;
-	margin-top: 60px;
-	position: relative;
-	margin-bottom: 80px;
-}
-
-.re-item {
-	margin-bottom: 20px;
-	margin-left: -100px;
-}
-
-.re-label {
-	font-size: 18px;
-	margin-right: 28px;
-}
-
-.re-li {
-	width: 355px;
-	height: 42px;
-	border: 1px solid #D8DCE6;
-	border-radius: 4px;
-	padding: 0 17px;
-	box-sizing: border-box;
-}
-
-.note {
-	justify-content: center;
-}
-
-.note image {
-	width: 16px;
-	height: 16px;
-	margin-right: 10px;
-}
-.note text {
-	font-size: 14px;
-}
-.query-btn{
-	width: 353px;
-	height: 42px;
-	line-height: 42px;
-	background: #1AA1E6;
-	border-radius: 5px 5px 5px 5px;
-	opacity: 1;
-	color: #fff;
-	text-align: center;
-	font-size: 16px;
-	margin: 27px 0 0 0;
-	cursor: pointer;
-}
-.link-btn{
-	background: #FFFFFF;
-	border-radius: 10px 10px 10px 10px;
-	opacity: 1;
-	padding: 10px 30px;
-	font-size: 16px;
-	margin-right: 20px;
-	cursor: pointer;
-}
-.link-btn:last-child{
-	margin-right: 0px;
+     width: 100%;
+     z-index: 1;
+}
+ .bottom_bg {
+     width: 100%;
+     position: fixed;
+     bottom: 0.5rem;
+}
+ .content-box {
+     z-index: 1;
+     justify-content: center;
+     margin-top: 0.6rem;
+     position: relative;
+     margin-bottom: 0.8rem;
+}
+ .re-item {
+     margin-bottom: 0.2rem;
+     margin-left: -1rem;
+}
+ .re-label {
+     font-size: 0.18rem;
+     margin-right: 0.28rem;
+}
+ .re-li {
+     width: 3.55rem;
+     height: 0.42rem;
+     border: 0.01rem solid #D8DCE6;
+     border-radius: 0.04rem;
+     padding: 0 0.17rem;
+     box-sizing: border-box;
+}
+ .note {
+     justify-content: center;
+}
+ .note image {
+     width: 0.16rem;
+     height: 0.16rem;
+     margin-right: 0.1rem;
+}
+ .note text {
+     font-size: 0.14rem;
+}
+ .query-btn{
+     width: 3.53rem;
+     height: 0.42rem;
+     line-height: 0.42rem;
+     background: #1AA1E6;
+     border-radius: 0.05rem 0.05rem 0.05rem 0.05rem;
+     opacity: 1;
+     color: #fff;
+     text-align: center;
+     font-size: 0.16rem;
+     margin: 0.27rem 0 0 0;
+     cursor: pointer;
+}
+ .link-btn{
+     background: #FFFFFF;
+     border-radius: 0.1rem 0.1rem 0.1rem 0.1rem;
+     opacity: 1;
+     padding: 0.1rem 0.3rem;
+     font-size: 0.16rem;
+     margin-right: 0.2rem;
+     cursor: pointer;
+}
+ .link-btn:last-child{
+     margin-right: 0rem;
+}
+ .re-ipt {
+     font-size: 0.14rem;
+     color: #333;
+     line-height: 0.34rem;
 }
 
 

+ 25 - 4
pages/certificateQuery/certificateQuery.vue

@@ -1,4 +1,5 @@
 <template>
+	<page-meta :root-font-size="fontsize+'px'" style="display: block;">
 	<view style="position: relative;" v-if="isPc">
 		<Headers></Headers>
 		
@@ -34,12 +35,12 @@
 			</view>
 		</view>
 		
-		<view class="ddflex" style="z-index: 1;position: relative;justify-content: center;text-align: center;margin-bottom: 60px;padding: 30px;">
+		<view class="ddflex" style="z-index: 1;position: relative;justify-content: center;text-align: center;margin-bottom: 0.6rem;padding: 0.3rem;">
 			<view>
-				<view>
+				<view style="font-size: 0.18rem;">
 					第三方证书查询平台
 				</view>
-				<view class="ddflex" style="justify-content: center;margin-top: 18px">
+				<view class="ddflex" style="justify-content: center;margin-top: 0.18rem">
 					<view class="link-btn" v-for="item in otherLink" @click="jumpLink(item.link)">{{item.title}}</view>
 				</view>
 			</view>
@@ -90,6 +91,7 @@
 			</view>
 		</view>
 	</view>
+	</page-meta>
 </template>
 
 <script>
@@ -124,10 +126,29 @@
 					link:'https://jdcjcwx.jtzyzg.org.cn/JDCJCWX/LEAP/jdcjcwx/html/publicQuery.html#cer'
 				}],
 				
-				systemInfo:{}
+				systemInfo:{},
+				fontsize:'100px'
 			}
 		},
 		onLoad() {
+			let srceenNunber = 19.2; //因设计图是1920所有把设计图分为19.2份,所以html字体大小为100px
+			    let that = this;
+			
+			    //窗体改变大小触发事件
+			    uni.onWindowResize((res) => {
+			        console.log('变化后的窗口宽度=', res.size.windowWidth);
+			        that.fontsize = parseFloat(res.size.windowWidth) / srceenNunber;
+			    })
+			
+			    //打开获取屏幕大小
+			    uni.getSystemInfo({
+			        success(res) {
+			            console.log('设备信息:', res);
+			            that.fontsize = res.screenWidth / srceenNunber;
+			            console.log('字体大小:', that.fontsize);
+			        }
+			    })
+			
 			this.systemInfo = uni.getSystemInfoSync()
 			this.isPc = this.IsPC()
 		},

+ 159 - 176
pages/contentDetail/contentDetail.css

@@ -1,180 +1,163 @@
 .project {
-	height: 70px;
-	line-height: 70px;
-	background: #1AA1E6;
-	font-size: 24px;
-	color: #FFFFFF;
-	font-weight: bold;
-}
-
-.project-content {
-	margin: 38px 0;
-	justify-content: center;
-	align-items: stretch;
-}
-
+     height: 0.7rem;
+     line-height: 0.7rem;
+     background: #1AA1E6;
+     font-size: 0.24rem;
+     color: #FFFFFF;
+     font-weight: bold;
+}
+ .project-content {
+     margin: 0.38rem 0;
+     justify-content: center;
+     align-items: stretch;
+}
 /* 考试 */
-.test-box {
-	width: 890px;
-	/* min-height: 812px; */
-	background: #FFFFFF;
-	border-radius: 0px 0px 0px 0px;
-	opacity: 1;
-	border: 3px solid #FFFFFF;
-	position: relative;
-	padding: 30px;
-	box-sizing: border-box;
-}
-
-.test-title {
-	font-size: 26px;
-	font-family: Source Han Sans CN-Bold, Source Han Sans CN;
-	font-weight: bold;
-	color: #333333;
-	line-height: 36px;
-	text-align: center;
-	margin-top: 20px;
-}
-
-.test-time {
-	text-align: center;
-	margin-top: 10px;
-	font-size: 14px;
-	margin-bottom: 20px;
-}
-
-.yj-icon {
-	width: 77px;
-	height: 81px;
-	margin: 76px auto 0;
-}
-
-.yj-label {
-	text-align: center;
-	font-size: 18px;
-	margin-top: 18px;
-}
-.chufen-number{
-	color: #F45D44;
-	font-size: 46px;
-	margin: 76px auto 0;
-	text-align: center;
-}
-.score {
-	justify-content: center;
-	margin-top: 30px;
-	margin-bottom: 60px;
-	padding-left: 30px;
-}
-.score-label{
-	font-size: 16px;
-	color: #999999;
-}
-.score-value{
-	font-size: 24px;
-	color: #1AA1E6;
-	margin-top: 20px;
-}
-.line{
-	width: 1px;
-	height: 57px;
-	color: #DEDEDE;
-	background-color: #DEDEDE;
-	margin: 0 30px;
-}
-.back-btn{
-	width: 190px;
-	height: 46px;
-	background: #F5F5F5;
-	border-radius: 50px 50px 50px 50px;
-	opacity: 1;
-	font-size: 14px;
-	justify-content: center;
-	margin:200px auto 0;
-}
-.back-btn image{
-	width: 19px;
-	height: 15px;
-	margin-right: 10px;
-}
-
-
-.test-info {
-	width: 280px;
-	flex-direction: column;
-	margin-left: 30px;
-}
-
+ .test-box {
+     width: 8.9rem;
+    /* min-height: 8.12rem;
+     */
+     background: #FFFFFF;
+     border-radius: 0rem 0rem 0rem 0rem;
+     opacity: 1;
+     border: 0.03rem solid #FFFFFF;
+     position: relative;
+     padding: 0.3rem;
+     box-sizing: border-box;
+}
+ .test-title {
+     font-size: 0.26rem;
+     font-family: Source Han Sans CN-Bold, Source Han Sans CN;
+     font-weight: bold;
+     color: #333333;
+     line-height: 0.36rem;
+     text-align: center;
+     margin-top: 0.2rem;
+}
+ .test-time {
+     text-align: center;
+     margin-top: 0.1rem;
+     font-size: 0.14rem;
+     margin-bottom: 0.2rem;
+}
+ .yj-icon {
+     width: 0.77rem;
+     height: 0.81rem;
+     margin: 0.76rem auto 0;
+}
+ .yj-label {
+     text-align: center;
+     font-size: 0.18rem;
+     margin-top: 0.18rem;
+}
+ .chufen-number{
+     color: #F45D44;
+     font-size: 0.46rem;
+     margin: 0.76rem auto 0;
+     text-align: center;
+}
+ .score {
+     justify-content: center;
+     margin-top: 0.3rem;
+     margin-bottom: 0.6rem;
+     padding-left: 0.3rem;
+}
+ .score-label{
+     font-size: 0.16rem;
+     color: #999999;
+}
+ .score-value{
+     font-size: 0.24rem;
+     color: #1AA1E6;
+     margin-top: 0.2rem;
+}
+ .line{
+     width: 0.01rem;
+     height: 0.57rem;
+     color: #DEDEDE;
+     background-color: #DEDEDE;
+     margin: 0 0.3rem;
+}
+ .back-btn{
+     width: 1.9rem;
+     height: 0.46rem;
+     background: #F5F5F5;
+     border-radius: 0.5rem 0.5rem 0.5rem 0.5rem;
+     opacity: 1;
+     font-size: 0.14rem;
+     justify-content: center;
+     margin:2rem auto 0;
+}
+ .back-btn image{
+     width: 0.19rem;
+     height: 0.15rem;
+     margin-right: 0.1rem;
+}
+ .test-info {
+     width: 2.8rem;
+     flex-direction: column;
+     margin-left: 0.3rem;
+}
 /* 考试信息 */
-.test-people {
-	width: 100%;
-	background-color: #FFFFFF;
-	padding: 12px 11px;
-	box-sizing: border-box;
-}
-
-.test-people image {
-	width: 80px;
-	height: 89px;
-	margin-right: 19px;
-}
-
-.test-people-info {
-	flex-direction: column;
-	justify-content: space-between;
-	font-size: 14px;
-	flex: 1;
-	align-items: flex-start;
-}
-
-.test-people-label {
-	color: #999999;
-	line-height: 36px;
-	margin-right: 8px;
-}
-
-/* 考试公告 */
-.note-box {
-	width: 100%;
-	background-color: #FFFFFF;
-	padding: 20px;
-	box-sizing: border-box;
-	margin-bottom: 20px;
-}
-
-.note-title {
-	margin-bottom: 18px;
-	font-size: 16px;
-}
-
-.note-title-icon {
-	width: 18px;
-	height: 18px;
-	margin-right: 10px;
-}
-
-.note-item {
-	justify-content: space-between;
-	font-size: 12px;
-	font-weight: 400;
-	line-height: 30px;
-	font-family: Source Han Sans CN-Regular, Source Han Sans CN;
-	cursor: pointer;
-}
-
-.note-item-content {
-	color: #666666;
-	flex: 1;
-	overflow: hidden;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-	margin-right: 10px;
-}
-
-.note-item-content:hover {
-	text-decoration: underline #666666;
-}
-
-.note-item-date {
-	color: #999999;
+ .test-people {
+     width: 100%;
+     background-color: #FFFFFF;
+     padding: 0.12rem 0.11rem;
+     box-sizing: border-box;
+}
+ .test-people image {
+     width: 0.8rem;
+     height: 0.89rem;
+     margin-right: 0.19rem;
+}
+ .test-people-info {
+     flex-direction: column;
+     justify-content: space-between;
+     font-size: 0.14rem;
+     flex: 1;
+     align-items: flex-start;
+}
+ .test-people-label {
+     color: #999999;
+     line-height: 0.36rem;
+     margin-right: 0.08rem;
 }
+/* 考试公告 */
+ .note-box {
+     width: 100%;
+     background-color: #FFFFFF;
+     padding: 0.2rem;
+     box-sizing: border-box;
+     margin-bottom: 0.2rem;
+}
+ .note-title {
+     margin-bottom: 0.18rem;
+     font-size: 0.16rem;
+}
+ .note-title-icon {
+     width: 0.18rem;
+     height: 0.18rem;
+     margin-right: 0.1rem;
+}
+ .note-item {
+     justify-content: space-between;
+     font-size: 0.12rem;
+     font-weight: 400;
+     line-height: 0.3rem;
+     font-family: Source Han Sans CN-Regular, Source Han Sans CN;
+     cursor: pointer;
+}
+ .note-item-content {
+     color: #666666;
+     flex: 1;
+     overflow: hidden;
+     text-overflow: ellipsis;
+     white-space: nowrap;
+     margin-right: 0.1rem;
+}
+ .note-item-content:hover {
+     text-decoration: underline #666666;
+}
+ .note-item-date {
+     color: #999999;
+}
+ 

+ 27 - 5
pages/contentDetail/contentDetail.vue

@@ -1,8 +1,9 @@
 <template>
+	<page-meta :root-font-size="fontsize+'px'" style="display: block;">
 	<view>
 		<Headers></Headers>
 		<view class="project">
-			<view style="width: 1200px;margin: auto;">职业技能在线考试系统</view>
+			<view style="width: 12rem;margin: auto;">职业技能在线考试系统</view>
 		</view>
 		
 		<view class="project-content ddflex">
@@ -10,11 +11,12 @@
 			<view class="test-box">
 				<view class="test-title">{{content.title}}</view>
 				<view class="test-time">
-					<text style="color: #999999;margin-right: 10px;">发布日期</text>
+					<text style="color: #999999;margin-right: 0.1rem;">发布日期</text>
 					<text>{{content.time}}</text>
 				</view>
-				<mp-html :content="content.text" :lazy-load="true" @imgtap="choose"></mp-html>
-				
+				<view style="font-size: 0.16rem;">
+					<mp-html :content="content.text" :lazy-load="true" @imgtap="choose"></mp-html>
+				</view>
 			</view>
 			<!-- 答题卡区域 -->
 			<view class="test-info ddflex">
@@ -46,6 +48,7 @@
 		
 		<Foot></Foot>
 	</view>
+	</page-meta>
 </template>
 
 <script>
@@ -58,11 +61,30 @@
 				id:null,
 				content:'',
 				otherInfo:[],
-				noteInfo:[]
+				noteInfo:[],
+				fontsize:'100px'
 			}
 		},
 		onReady() {},
 		onLoad(options) {
+			let srceenNunber = 19.2; //因设计图是1920所有把设计图分为19.2份,所以html字体大小为100px
+			    let that = this;
+			
+			    //窗体改变大小触发事件
+			    uni.onWindowResize((res) => {
+			        console.log('变化后的窗口宽度=', res.size.windowWidth);
+			        that.fontsize = parseFloat(res.size.windowWidth) / srceenNunber;
+			    })
+			
+			    //打开获取屏幕大小
+			    uni.getSystemInfo({
+			        success(res) {
+			            console.log('设备信息:', res);
+			            that.fontsize = res.screenWidth / srceenNunber;
+			            console.log('字体大小:', that.fontsize);
+			        }
+			    })
+			
 			this.id = options.id
 			this.getDetail()
 			this.getTextOtherInfo()