1

src/views/patent.vue

@@ -2,42 +2,49 @@
   <div id="patent">
     <van-row>
       <van-col span="24" class="main">
-        <van-col span="24" class="one">
-          <van-col span="24" class="one_1"> 吉林省专利市场简介 </van-col>
-        </van-col>
-        <van-col span="24" class="two">
-          <van-col span="24" class="two_1">
-            <p>2019 年 6 月吉林省科技大市场批复建设吉林省专利分市场，由吉林省科企技术转移转化研究院有限责任公司与吉林省科技大市场和长春新区科技局联合共建。</p>
-            <van-image :src="img_one" class="image"></van-image>
-          </van-col>
-          <van-col span="24" class="two_2">
-            <van-col span="14" class="txt">
-              <p>“吉林专利市场”公众号</p>
-              <p>
-                整合利用省内优势文献信息资源，建设“吉林专利市场”公众号，打造权威专利信息平台和特色专利数据库，嵌入政策资讯、法律法规、研究报告数据库模块，助力提升专利信息分析利用能力。联合省内现有专利平台和服务机构，建设专利超市，开展专利检索、专利转让、专利需求和专利导航服务。
-              </p>
-            </van-col>
-            <van-col span="10" class="image">
-              <van-image :src="img_two" class="images"></van-image>
-            </van-col>
-          </van-col>
-          <van-col span="24" class="two_2">
-            <van-col span="10" class="image">
-              <van-image :src="img_thr" class="images"></van-image>
-            </van-col>
-            <van-col span="14" class="txt">
-              <p>“e 专利”平台</p>
-              <p>
-                以吉林省发明和科技评价协会为支撑，搭建吉林省“e 专利”平台， 完善发明人和发明专利数据库，以统一开放的技术交易平台为纽带，以项目承担单位的信息资源
-                和专家人才为依托，加强专利成果供给与转化应用，形成紧密互动的 专利技术转移网络，构建吉林省科技大市场专利分市场信息基础，嵌
-                入吉林省科技大市场网上市场功能，打造全省发明专利专门交易平台。
-              </p>
-            </van-col>
-          </van-col>
-          <van-col span="24" class="two_4">
-            <van-image :src="img_four" class="image"></van-image>
-          </van-col>
-        </van-col>
+        <div class="w_1200">
+          <el-col :span="24" class="one">
+            <el-col :span="24" class="one_1"> 吉林省专利市场简介 </el-col>
+            <el-col :span="24" class="one_2">
+              <el-col :span="24" class="two_1">
+                <p>
+                  吉林省科技大市场专利分市场2019年6月由吉林省技术产权交易中心批复建设，由吉林省科企技术转移转化研究院有限责任公司与吉林省科技大市场和长春新区科技局联合共建。
+                </p>
+                <el-image :src="img_one" class="image"></el-image>
+              </el-col>
+              <el-col :span="24" class="two_2">
+                <el-col :span="14" class="txt">
+                  <p>“吉林专利市场”公众号</p>
+                  <p>
+                    整合利用省内优势文献信息资源，建设“吉林专利市场”公众号，打造权威专利信息平台和特色专利数据库，嵌入政策资讯、法律法规、研究报告数据库模块，助力提升专利信息分析利用能力。联合省内现有专利平台和服务机构，建设专利超市，开展专利检索、专利转让、专利需求和专利导航服务。
+                  </p>
+                </el-col>
+                <el-col :span="10" class="image">
+                  <el-image :src="img_two" class="images"></el-image>
+                </el-col>
+              </el-col>
+              <el-col span="24" class="two_3">
+                <el-col span="8" class="txt">
+                  <p>“e 专利”平台</p>
+                  <p>
+                    以吉林省发明和科技评价协会为支撑，搭建吉林省“e专利”平台，完善发明人和发明专利数据库，以统一开放的技术交易平台为纽带，以项目承担单位的信息资源和专家人才为依托，加
+                  </p>
+                </el-col>
+                <el-col span="16" class="image">
+                  <el-image :src="img_thr" class="images"></el-image>
+                </el-col>
+                <el-col :span="24" class="text">
+                  <p>
+                    强专利成果供给与转化应用，形成紧密互动的专利技术转移网络，构建吉林省科技大市场专利分市场信息基础，嵌入吉林省科技大市场网上市场功能，打造全省发明专利专门交易平台。
+                  </p>
+                </el-col>
+              </el-col>
+              <el-col span="24" class="two_4">
+                <el-image :src="img_four" class="image"></el-image>
+              </el-col>
+            </el-col>
+          </el-col>
+        </div>
       </van-col>
     </van-row>
   </div>
@@ -76,8 +83,12 @@ export default {
 </script>
 
 <style lang="less" scoped>
+.w_1200 {
+  width: 1200px;
+  margin: 0 auto;
+}
 .main {
-  padding: 3% 28%;
+  padding: 3% 0;
   .one {
     .one_1 {
       font-size: 30px;
@@ -86,65 +97,99 @@ export default {
       margin: 0 0 20px 0;
       font-family: 'Courier New', Courier, monospace;
     }
-  }
-  .two {
-    border: 1px solid #409eff;
-    padding: 20px 20px 10px 20px;
-    border-radius: 5px;
-    .two_1 {
-      margin: 0 0 10px 0;
-      text-align: center;
-      p {
-        font-size: 22px;
-        text-align: left;
+    .one_2 {
+      border: 1px solid #409eff;
+      padding: 36px 15%;
+      border-radius: 5px;
+      .two_1 {
         margin: 0 0 10px 0;
-        font-family: cursive;
-        line-height: 40px;
+        text-align: center;
+        p {
+          font-size: 22px;
+          text-align: left;
+          margin: 0 0 10px 0;
+          font-family: cursive;
+          line-height: 40px;
+          text-indent: 2rem;
+        }
+        .image {
+          width: 600px;
+          height: 400px;
+          overflow: hidden;
+        }
       }
-      .image {
-        width: 90%;
-        height: 10%;
-        overflow: hidden;
-        border-radius: 10px;
+      .two_2 {
+        margin: 20px 0 10px 0;
+        .txt {
+          font-size: 22px;
+          text-align: left;
+          margin: 0 0 10px 0;
+          font-family: cursive;
+          line-height: 40px;
+          p:nth-child(1) {
+            margin: 0 0 0 10px;
+            font-weight: bold;
+          }
+          p:nth-child(2) {
+            padding: 0 5px;
+            text-indent: 2rem;
+          }
+        }
+        .image {
+          text-align: center;
+          margin: 45px 0 0 0;
+          .images {
+            width: 300px;
+            height: 300px;
+            overflow: hidden;
+          }
+        }
       }
-    }
-    .two_2 {
-      margin: 0 0 10px 0;
-      .txt {
-        font-size: 22px;
-        text-align: left;
-        margin: 0 0 10px 0;
-        font-family: cursive;
-        line-height: 40px;
-
-        p:nth-child(1) {
-          font-weight: bold;
+      .two_3 {
+        margin: 20px 0;
+        .txt {
+          font-size: 22px;
+          text-align: left;
+          font-family: cursive;
+          line-height: 45px;
+          p:nth-child(1) {
+            margin: 0 0 0 10px;
+            font-weight: bold;
+          }
+          p:nth-child(2) {
+            padding: 0 5px;
+            text-indent: 2rem;
+          }
         }
-        p:nth-child(2) {
-          padding: 0 5px;
-          text-indent: 2rem;
+        .image {
+          text-align: center;
+          margin: 45px 0 0 0;
+          .images {
+            width: 500px;
+            height: 300px;
+            overflow: hidden;
+          }
+        }
+        .text {
+          font-size: 22px;
+          text-align: left;
+          margin: 0 0 10px 0;
+          font-family: cursive;
+          line-height: 45px;
+          p {
+            padding: 0 5px;
+          }
         }
       }
-      .image {
+      .two_4 {
         text-align: center;
-        margin: 45px 0;
-        .images {
+        .image {
           width: 100%;
-          height: 300px;
+          height: 450px;
           overflow: hidden;
-          border-radius: 10px;
         }
       }
     }
-    .two_4 {
-      text-align: center;
-      .image {
-        width: 100%;
-        height: 450px;
-        overflow: hidden;
-        border-radius: 10px;
-      }
-    }
   }
 }
 </style>