微信小程序在线考试系统 毕业设计（5）答题卡

wxml代码

<!--pages/tiku/kaoshi.wxml--> <view class="biaoti">当前考试答题卡：HTML入门测试</view> <view class="yanse"> <view class="yanse_lvse"> <view class="yanse_lvse1">序号</view> <view class="yanse_lvse2">已经答题</view> </view> <view class="yanse_huise"> <view class="yanse_huise1">序号</view> <view class="yanse_huise2">没有答题</view> </view> </view> <view class="timu"> <navigator class="timu_xuhao timu_yida" url="/pages/shipin/index2" >1</navigator> <navigator class="timu_xuhao timu_yida" url="/pages/shipin/index2" >2</navigator> <navigator class="timu_xuhao timu_yida" url="/pages/shipin/index2" >3</navigator> <navigator class="timu_xuhao timu_yida" url="/pages/shipin/index2" >4</navigator> <navigator class="timu_xuhao timu_yida" url="/pages/shipin/index2" >5</navigator> <navigator class="timu_xuhao timu_yida" url="/pages/shipin/index2" >6</navigator> <navigator class="timu_xuhao timu_yida" url="/pages/shipin/index2" >7</navigator> <navigator class="timu_xuhao timu_yida" url="/pages/shipin/index2" >8</navigator> <navigator class="timu_xuhao timu_yida" url="/pages/shipin/index2" >9</navigator> <navigator class="timu_xuhao timu_yida" url="/pages/shipin/index2" >10</navigator> <navigator class="timu_xuhao" url="/pages/shipin/index2" >11</navigator> <navigator class="timu_xuhao" url="/pages/shipin/index2" >12</navigator> <navigator class="timu_xuhao" url="/pages/shipin/index2" >13</navigator> <navigator class="timu_xuhao" url="/pages/shipin/index2" >14</navigator> <navigator class="timu_xuhao" url="/pages/shipin/index2" >15</navigator> <navigator class="timu_xuhao" url="/pages/shipin/index2" >16</navigator> <navigator class="timu_xuhao" url="/pages/shipin/index2" >17</navigator> <navigator class="timu_xuhao" url="/pages/shipin/index2" >18</navigator> <navigator class="timu_xuhao" url="/pages/shipin/index2" >19</navigator> </view> <view class="caidan"> <navigator class="caidan_shouye" url="/pages/index/index" open-type="switchTab"> <image class="caidan_shouye_tu" src="/img/sp01.png"></image> <view class="caidan_shouye_wenzi">首页</view> </navigator> <navigator class="caidan_shoucang" url="/pages/tiku/kaoshi"> <image class="caidan_shoucang_tu" src="/img/e-off.png"></image> <view class="caidan_shoucang_wenzi">返回考试</view> </navigator> <view class="caidan_goumai">提交试卷</view> </view>

wxss代码

/* pages/tiku/kaoshi.wxss */ .biaoti{font-size: 16px; padding:10px; background-color: #f2f2f2; text-align: center;color: rgb(10, 149, 236); box-sizing: border-box; text-shadow: 1px 1px 2px gainsboro;} .yanse{padding: 5px; display: flex; border-bottom: 1px dotted gainsboro; } .yanse_lvse{padding: 5px; width: 50%; box-sizing: border-box; display: flex;align-items: center; width: 100%;} .yanse_lvse1{background-color: green;width:50%; text-align: center;color: white;} .yanse_lvse2{color: green; padding-left: 10px;} .yanse_huise{padding: 5px;width: 50%;box-sizing: border-box; display: flex;align-items: center;width: 100%;} .yanse_huise1{background-color:#f2f2f2 ;width:50%; text-align: center;} .yanse_huise2{color: gray;padding-left: 10px;} .timu{ display: flex; flex-wrap: wrap; font-size: 14px; padding: 10px; box-sizing: border-box; } .timu_xuhao{ width: 25%;padding: 5px;box-sizing: border-box;font-size: 16px;text-align: center; background-color:#f2f2f2;border-radius: 5px;border:5px solid white; } .timu_yida{background-color: green; color: white;} .caidan{ height: 45px;background-color: white; display: flex; position: fixed; bottom: 0; width: 100%; font-size: 15px; color: gray; text-align: center;border-top: 1px solid gainsboro; } .caidan_shouye{width: 25%; display: flex; flex-direction: column;justify-content: center; align-items: center;border-right: 1px solid gainsboro;} .caidan_shouye_tu{width: 20px;height: 20px;} .caidan_shouye_wenzi{} .caidan_shoucang{width: 25%;display: flex; flex-direction: column;justify-content: center; align-items: center;} .caidan_shoucang_tu{width: 16px;height: 16px;} .caidan_shoucang_wenzi{} .caidan_goumai{width: 50%;line-height: 45px; background-color: orangered; color: white;line-height: 45px; text-align: center;}