小改

src/pages/shijiankecheng/shijiankecheng.css

@@ -181,39 +181,54 @@
 
 .kc_main_box3{
     width: 1200px;
+    height: 52px;
+    padding-bottom: 20px;
     font-size: 14px;
     margin-left: auto;
     margin-right: auto;
 }
-.kc_main_box3_center{
-    display: flex;
-    flex-flow: row wrap;
-}
-.kc_main_box3_center_left{
-    position: relative;
-    max-width: 100%;
-    min-height: 1px;
-    flex: 1 1 0%;
-}
-.kc_main_box3_center_left button{
-    border-radius: 40px;
-    box-shadow: none;
-    background-color: #4cacff;
-    border-color: #4cacff;
+.kc_main_box3_box{
     padding: 3px 11px;
     border: 1px;
-    color: #fff;
     margin-right: 20px;
+    border-radius: 40px;
+    font-size: 14px;
+    float: left;
+    background: #1890ff;
+    color: white;
 }
-.kc_main_box3_center_right{
-    position: relative;
-    max-width: 100%;
-    min-height: 1px;
-    flex: 0 0 702px;
+.kc_main_box3_right{
+
 }
+
+
+
 .kc_main_box4{
     width: 1200px;
     font-size: 14px;
     margin-left: auto;
     margin-right: auto;
 }
+.kc_main_box4_box{
+    width: 280px;
+    box-shadow: 0 0 12px rgba(0,0,0,.1);
+    margin-bottom: 35px;
+    display: inline-block;
+    transition: all .5s;
+    border-radius: 8px;
+    overflow: hidden;
+    cursor: pointer;
+}
+.kc_main_box4_box_shang{
+    height: 175px;
+    width: 100%;
+    overflow: hidden;
+}
+.kc_main_box4_box_shang img{
+    width: 100%;
+    border-radius: 8px 8px 0 0;
+    transition: all .5s;
+}
+.kc_main_box4_box_xia{
+    padding: 15px;
+}

src/pages/shijiankecheng/shijiankecheng.js

@@ -1,5 +1,6 @@
 import React, { Component } from "react";
 import "./shijiankecheng.css";
+import Center6 from "../shouye/component/tg_dibu/center6";
 
 export default class Shijiankecheng extends Component {
   render() {
@@ -393,15 +394,18 @@ export default class Shijiankecheng extends Component {
           </div>
         </div>
         <div className="kc_main_box3">
-          <div className="kc_main_box3_center">
-            <div className="kc_main_box3_center_left">
-              <button>最 新</button>
-              <button>最 热</button>
+          <div className="kc_main_box3_box">最新</div>
+          <div className="kc_main_box3_box">最热</div>
+        </div>
+        <div className="kc_main_box4">
+          <div className="kc_main_box4_box">
+            <div className="kc_main_box4_box_shang">
+              <img src="https://ali-cdn.educoder.net/images/avatars/Subject/149?t=1566570433"></img>
             </div>
-            <div className="kc_main_box3_center_right"></div>
+            <div className="kc_main_box4_box_xia"></div>
           </div>
         </div>
-        <div className="kc_main_box4"></div>
+        <Center6></Center6>
       </div>
     );
   }