certificate-admin/ruoyi-ui/src/views/certInquire/index.vue

<template>
  <div class="main">
    <div class="content">
      <img src="../../assets/logo/logo2.png"/>
      <router-link tag="div" :to="{name:'Member'}" class="content-btn">会员、理事证书、聘书查询</router-link>
      <router-link tag="div" :to="{name:'Train'}" class="content-btn">结业证书、学时证明查询</router-link>
      <router-link tag="div" :to="{name:'Profess'}" class="content-btn">专业能力证书查询</router-link>
    </div>
  </div>
</template>
<script>
</script>
<style lang="scss">
.main{
  background-image: url("../../assets/images/img31.jpg");
  background-size: cover;
  height: 100%;
}
.content{
  border-radius: 6px;
  // background: #ffffff;
  width: 600px;
  padding: 25px 25px 5px 25px;
  position:fixed;
  top:50%;
  left:50%;
  transform: translate(-50%, -50%);
  img{
    width:100%
  }
  .content-btn{
    width:100%;
    height:50px;
    line-height:50px;
    text-align:center;
    background-color:#eeeef2;
    margin:20px 10px;
    border-radius:10px;  
  }
}
body,html{
  height: 100vh;
  width: 100vw;
}
// .height100{
//   height: 100%;
// }
// .main {
//   text-align: left;
//   height: 100%;
//   width: 100%;
//   // margin: 100px auto;
//   // width: 500px;
//   // position: absolute;
//   // left: 50%;
//   // top: 50%;
//   // transform: translate(-50%, -50%);
// }
// .main-content{
//   width: 500px;
//   position: absolute;
//   left: 50%;
//   top: 50%;
//   transform: translate(-50%, -50%);
// }
// .img-box {
//   width: 360px;
//   height: 80px;
// //   background-color: brown;
//   text-align: center;
//   img{
//     height: 100%;
//     transform: scale(1.5);
//   }
// }
// .main-title {
//   width: 360px;
//   text-align: center;
// }
// .label-box {
//   display: flex;
//   align-items: center;
//   margin: 10px 0;
// }
// .label-title {
//   width: 150px;
//   line-height: 22px;
//   flex: 0 0 auto;
//   text-align: center;
// }
// .label-input {
//   line-height: 30px;
//   width: 210px;
//   border: 1px solid #50ac55;
//   padding-left: 10px;
//   box-sizing: border-box;
//   height: 45px;
//   line-height: 45px;
// }
// .label-must {
//   color: red;
// }
// .btn-box {
//   text-align: right;
// }
// .btn-box button {
//   width: 140px;
//   height: 40px;
//   margin: 10px;
// }
// .btn-reset {
//   background-color: #f1f2f3;
//   border: none;
// }
// .btn-search {
//   background-color: rgb(176,11,17);
//   color: white;
//     border: none;
// }
// .captcha-img {
//   width: 120px;
//   background: antiquewhite;
//   margin: auto;
//   height: 50px;
// }
// .activeSpan{
//     color: #50ac55;
// }

// .zs-title-img{
//   display: block;
//     margin: auto;
//     height: 75px;
//     transform: scale(1.7);
// }


// ::v-deep .el-dialog__body {
//   padding: 0px;
//   display: flex;
//   justify-content: center;
// }
// #pdfDom {
//   /* 要想pdf周边留白，要在这里设置 */
//   /* padding: 20px; */
//   width: 750px;
//   margin: auto;
// }
// .proBox {
//   background-size: cover;
//   width: 750px;
//   height: 525px;
//   padding: 40px 60px;
//   box-sizing: border-box;
//   margin: 0 auto;
//   position: relative;
//   color: #000;
//   font-family: 楷体;
//   font-size: 16px;
// }

// .proBox-img{
//   width: 750px;
//   height: 525px;
//   position: absolute;
//   top: 0;
//   left: 0;
// }



// .tit {
//   color: #000;
//   font-size: 22px;
//   font-weight: 700;
//   position: relative;
//   top: -6px;
//   left: 8px;
//   letter-spacing: 2px;
//   font-family: STHeiti;
//   margin: 10px 0;
//   text-align: center;
// }
// .proid {
//   text-align: right;
//   margin: 0;
//   font-weight: 500;
//   /* margin-right: 5px; */
// }
// .con {
//   font-size: 18px;
//   text-align: left;
//   margin: 10px 0;
//   line-height: 32px;
//   text-indent: 2em;
//   position: absolute;
//   bottom: 265px;
//   margin-top: 30px;
//   padding-right: 80px;
//   left: 88px;
// }
// .con-name {
//   margin-right: 10px;
//   margin-left: 10px;
//   font-size: 20px;
// }
// .heiti{
//   font-family:黑体 ;
// }
// .con-unit {
//   font-size: 20px;
//   font-weight: 700;
//   position: absolute;
//   right: 45px;
//   bottom: 100px;
//   z-index: 10;
//   text-align: center;
// }
// .con-unit p {
//   margin: 5px 0;
// }
// .con-footer {
//   position: absolute;
//   right: 0;
//   right: 45px;
//   bottom: 65px;
//   font-size: 10px;
//   z-index: 10;
// }
// .con-footer p{
//   margin: 0;
// }
// .chapter {
//   border-radius: 50%;
//   position: absolute;
//   bottom: 45px;
//   right: 40px;
// }
// .cert-msg{
//   font-size: 20px;
//   font-size: 15px;
//   position: absolute;
//   bottom: 50px;
//   left: 90px;
// }
// .foot-term{
//   position: absolute;
//   bottom: 160px;
//   left: 200px;
// }
// .foot-cert{
//   position: absolute;
//     bottom: 130px;
//     left: 200px;
// }
// .foot-date{
//   position: absolute;
//     bottom: 104px;
//     left: 200px;
// }
// .z10{
//   z-index: 10;
// }
// .z01{
//   z-index: 1;
// }
// .foot-pp{
//   position: absolute;
//   top: 273px;
//   left: 161px;
//   text-align: center;
//   line-height: 42px;
//   p{
//     margin: 0;
//   }
// }
@media screen and (max-width: 600px) {
  .content{
      width: 100%;padding: 10px;
      .content-btn{
        margin:10px 0
      }
  }
}
</style>