首页开发

src/views/index.vue

@@ -154,23 +154,66 @@
         <div class="title"></div>
         <div class="content">
           <img src="@/assets/images/3-01.png" alt="" />
-          <img src="@/assets/images/3-02.png" alt="" />
+          <div class="item">
+            <span>营销业务能力</span>
+          </div>
+          <div class="item">
+            <span>数字技术应用能力</span>
+          </div>
+          <div class="item">
+            <span>数据处理分析能力</span>
+          </div>
+          <!-- <img src="@/assets/images/3-02.png" alt="" />
           <img src="@/assets/images/3-03.png" alt="" />
-          <img src="@/assets/images/3-04.png" alt="" />
+          <img src="@/assets/images/3-04.png" alt="" /> -->
-        
         </div>
       </div>
       <div class="threeArrow">
         <img src="@/assets/images/5箭头-右.png" alt="" />
       </div>
-      <div class="portrait">
+      <div class="skill">
         <div class="title"></div>
         <div class="content">
-          <img src="@/assets/images/3-01.png" alt="" />
+          <div class="item">
-          <img src="@/assets/images/3-02.png" alt="" />
+            <span class="skillTitle">基础知识</span>
-          <img src="@/assets/images/3-03.png" alt="" />
+            <div
-          <img src="@/assets/images/3-04.png" alt="" />
+              style="padding-left: 25px; padding-right: 8px; padding-top: 6px"
-        
+            >
+              经济学原理、管理学原理、微观经济学、数字经济概论
+            </div>
+          </div>
+          <div class="item">
+            <span class="skillTitle">营销专业知识</span>
+            <div
+              style="padding-left: 25px; padding-right: 8px; padding-top: 6px"
+            >
+              市场营销学、市场营销策划、市场调查与预测、消费者行为、网络营销、商务沟通与谈判、新媒体营销
+            </div>
+          </div>
+          <div class="item">
+            <span class="skillTitle">技术基础知识</span>
+            <div
+              style="padding-left: 25px; padding-right: 8px; padding-top: 6px"
+            >
+              计算机、SQL数据库、PYTHON程序设计、高等数学、统计学、线性代数、大数据导论、新媒体技术
+            </div>
+          </div>
+          <div class="item">
+            <span class="skillTitle">数字技术应用能力</span>
+            <div
+              style="padding-left: 25px; padding-right: 8px; padding-top: 6px"
+            >
+              人工智能、AIGC、大模型、大数据、区块链、物联网、虚拟现实
+            </div>
+          </div>
+          <div class="item">
+            <span class="skillTitle">数据处理分析技能</span>
+            <div
+              style="padding-left: 25px; padding-right: 20px; padding-top: 6px"
+            >
+              数据采集、数据预处理、特征工程、数据挖掘、数据可视化、商务智能BI
+            </div>
+          </div>
         </div>
       </div>
     </div>
@@ -399,9 +442,76 @@ const modelTags = ref([
         img {
           // margin-bottom: 58px;
         }
-        img:nth-of-type(2),img:nth-of-type(4),img:nth-of-type(3){
+        img:nth-of-type(2),
+        img:nth-of-type(4),
+        img:nth-of-type(3) {
+          height: 185px;
+          margin-left: 10px;
+        }
+        .item:nth-of-type(1) {
+          margin-left: 10px;
+          width: 159px;
+          height: 185px;
+          background-image: url("@/assets/images/3-02.png");
+          background-size: 159px 185px;
+          padding-top: 140px;
+          text-align: center;
+          font-size: 14px;
+        }
+        .item:nth-of-type(2) {
+          margin-left: 10px;
+          width: 159px;
+          height: 185px;
+          background-image: url("@/assets/images/3-03.png");
+          background-size: 159px 185px;
+          padding-top: 140px;
+          text-align: center;
+          font-size: 14px;
+        }
+        .item:nth-of-type(3) {
+          margin-left: 10px;
+          width: 159px;
           height: 185px;
+          background-image: url("@/assets/images/3-04.png");
+          background-size: 159px 185px;
+          padding-top: 140px;
+          text-align: center;
+          font-size: 14px;
+        }
+      }
+    }
+    .skill {
       margin-left: 10px;
+      .title {
+        background-image: url("@/assets/images/4-1.png");
+        width: 319px;
+        height: 43px;
+        margin-bottom: 10px;
+      }
+      .content {
+        width: 319px;
+        height: 736px;
+        background-image: url("@/assets/images/4紫框.png");
+        background-size: 318px 735px;
+        padding: 0;
+        padding-left: 17px;
+        padding-top: 10px;
+        .item {
+          font-size: 14px;
+          width: 283px;
+          height: 145px;
+          background-image: url("@/assets/images/4-01.png");
+          background-size: 283px 145px;
+          padding-top: 16px;
+          .skillTitle {
+            margin-left: 15px;
+          }
+        }
+        .item:nth-last-of-type(1) {
+          width: 283px;
+          height: 130px;
+          background-image: url("@/assets/images/4-05.png");
+          background-size: 283px 130px;
         }
       }
     }