Merge branch 'feature/header' into 'master'

fix:优化样式

See merge request !1

src/css/style.css

@@ -3,7 +3,9 @@
 Primary style
 
 -------------------------------- */
-*, *:after, *:before {
+*,
+*:after,
+*:before {
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
@@ -16,7 +18,8 @@ body {
   background-color: white;
 }
 
-body, html {
+body,
+html {
   /* important */
   height: 100%;
 }
@@ -26,7 +29,6 @@ a {
   text-decoration: none;
 }
 
-
 /* -------------------------------- 
 
 Modules - reusable parts of our design
@@ -34,7 +36,7 @@ Modules - reusable parts of our design
 -------------------------------- */
 .cd-container {
   /* this class is used to give a max-width to the element it is applied to, and center it horizontally when it reaches that max-width */
-  width:90%;
+  width: 90%;
   max-width: 900px;
   /* margin: 0 auto; */
   margin: 0 auto;
@@ -42,12 +44,13 @@ Modules - reusable parts of our design
 }
 .cd-container::after {
   /* clearfix */
-  content: '';
+  content: "";
   display: table;
   clear: both;
 }
 
-.cd-container h2,.cd-container h3{
+.cd-container h2,
+.cd-container h3 {
   max-height: 50px;
   font-size: 1.5em;
   border-bottom: 1px #ccc solid;
@@ -55,16 +58,16 @@ Modules - reusable parts of our design
   width: 100%;
   margin: 1em 0 0 0;
 }
-.cd-container h3{
-  border:none;
+.cd-container h3 {
+  border: none;
   font-size: 1.2em;
 }
-.cd-container ul{
+.cd-container ul {
   margin: 1em auto 0;
 }
 
 /* 企业数字 */
-.csdn-digitalinfo{
+.csdn-digitalinfo {
   float: left;
   margin: 24px 0;
   width: 50%;
@@ -72,80 +75,87 @@ Modules - reusable parts of our design
   padding: 0 24px;
   min-height: 80px;
 }
-.csdn-digitalinfo .title{
+.csdn-digitalinfo .title {
   font-size: 18px;
   line-height: 24px;
 }
-.csdn-digitalinfo .content{
+.csdn-digitalinfo .content {
   font-size: 14px;
   line-height: 22px;
   min-height: 70px;
 }
 
 /* 企业数字 */
-.csdn-digitalinfo2{
-  float: left;
+
+.digitalinfo2-container {
+  display: flex;
+  justify-content: space-between;
+  flex-wrap: wrap;
+}
+
+.csdn-digitalinfo2 {
+  /* float: left; */
   margin: 24px 0;
   width: 50%;
   text-align: center;
   padding: 0 24px;
   min-height: 80px;
 }
-.csdn-digitalinfo2 .title{
+.csdn-digitalinfo2 .title {
   font-size: 18px;
   line-height: 24px;
 }
-.csdn-digitalinfo2 .content{
+.csdn-digitalinfo2 .content {
   font-size: 14px;
   line-height: 22px;
   min-height: 70px;
 }
 
 /* 新媒体矩阵 */
-.newmedia{
+.newmedia {
   float: left;
-  width:95px;
+  width: 95px;
   margin: 0 5px 0 0;
   text-align: center;
   height: 142px;
 }
-.newmedia .content{
-  line-height:20px;
+.newmedia .content {
+  line-height: 20px;
 }
 
-.newmedia .QR{
+.newmedia .QR {
   background: #fff;
 }
-.newmedia img{
+.newmedia img {
   width: 95px;
   height: 95px;
 }
 
 @media only screen and (min-width: 768px) {
-  .csdn-digitalinfo{
+  .csdn-digitalinfo {
     width: 20%;
     padding: 0 8px;
     min-height: 45px;
   }
-  .csdn-digitalinfo .title{
+  .csdn-digitalinfo .title {
     font-size: 24px;
     line-height: 30px;
   }
-  .csdn-digitalinfo .content{
+  .csdn-digitalinfo .content {
     font-size: 14px;
     line-height: 24px;
   }
 
-  .csdn-digitalinfo2{
+  .csdn-digitalinfo2 {
     width: 12%;
     padding: 0 0px;
     min-height: 45px;
   }
-  .csdn-digitalinfo2 .title{
+  .csdn-digitalinfo2 .title {
     font-size: 24px;
     line-height: 30px;
   }
-  .csdn-digitalinfo2 .content{
+  .csdn-digitalinfo2 .content {
     font-size: 14px;
     line-height: 24px;
   }
@@ -154,11 +164,13 @@ Modules - reusable parts of our design
 /* .cd-container a{
   font-weight: 400;
 } */
-.cd-container a:hover{
-  color: #FC5531;
+.cd-container a:hover {
+  color: #fc5531;
 }
 
-h1, h2, h3 {
+h1,
+h2,
+h3 {
   font-weight: 400 !important;
 }
 /* -------------------------------- 
@@ -171,9 +183,10 @@ Main components
   top: 0;
   left: 0;
   width: 100%;
-  height: 50px;
-  background: rgba(255, 255, 255, 0.95);
-  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
+  height: 40px;
+  background: #223544;
+  padding: 0 16px;
+  /* box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2); */
   z-index: 2;
 }
 .cd-header:after {
@@ -183,50 +196,137 @@ Main components
 }
 .cd-header #cd-logo {
   float: left;
-  margin: 16px 0 0 20px;
+  display: flex;
+  height: 100%;
+  align-items: center;
+  margin-right: 40px;
 }
 .cd-header #cd-logo img {
   display: block;
-  width: 120px;
+  height: 24px;
 }
-.csdnchart{
+.csdnchart {
   width: 100%;
   /* text-align: center; */
-  margin:24px 0 0 0;
+  margin: 24px 0 0 0;
   background-repeat: no-repeat;
   background-size: 100%;
 }
-.CSDN-chart01{
+.CSDN-chart01 {
   background-image: url(../img/meeting@2x.png);
   background-position: center 80%;
 }
-.CSDN-chart01 span{
+.CSDN-chart01 span {
   font-size: 12px;
   text-align: center;
   width: 100%;
   margin: 30% 0 0 0;
   display: inline-block;
 }
+
+.container-nav .menu {
+  padding: 4px;
+  box-sizing: border-box;
+  overflow: hidden;
+  height: 100%;
+}
+
+.container-nav .menu li {
+  float: left;
+  font-size: 14px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: #fff;
+  font-weight: 600;
+  min-width: 88px;
+  padding: 0 8px;
+  box-sizing: border-box;
+  text-align: center;
+  height: 100%;
+  border-radius: 4px;
+  cursor: pointer;
+
+}
+
+.partner {
+  display: flex;
+  justify-content: flex-start;
+  flex-wrap: wrap;
+  margin-left: -20px;
+}
+
+.partner span {
+  margin-left: 20px;
+}
+
+@media screen and (max-width: 768px){
+  .m-d-none {
+    display: none !important;
+  }
+  .container-nav .menu li  {
+    min-width: unset;
+  }
+  .cd-header #cd-logo {
+    margin-right: 6px;
+  }
+}
+.container-nav .menu .input_box {
+  width: 200px;
+  height: 100%;
+  border-radius: 4px;
+  overflow: hidden;
+}
+
+.container-nav .menu input {
+  padding: 0 0 0 10px;
+  width: 100%;
+  outline: none;
+  border: none;
+  height: 100%;
+  color: #fff;
+  background: rgba(209, 209, 240, 0.2);
+}
+.container-nav .menu input::placeholder {
+  color: rgba(209, 209, 240, 0.8);
+}
+
+.container-nav .menu input:focus {
+  background: #fff;
+  color: #606266;
+}
+
+.container-nav .menu li:hover {
+  background-color: rgba(209, 209, 240, 0.2);
+}
+
+.container-nav .menu li a {
+  color: #fff;
+  width: 100%;
+  height: 100%;
+  line-height: 32px;
+}
+
 @media only screen and (min-width: 375px) {
-  .CSDN-chart01 span{
+  .CSDN-chart01 span {
     margin: 24% 0 0 0;
   }
-  .medias .newmedia{
+  .medias .newmedia {
     width: 45% !important;
-    height:192px;
+    height: 192px;
   }
 }
 
 @media only screen and (min-width: 768px) {
-  .cd-header {
+  /* .cd-header {
     height: 60px;
-  }
-  .cd-header #cd-logo {
+  } */
+  /* .cd-header #cd-logo {
     margin: 14px 0 0 0px;
   }
   .CSDN-chart01 span{
     margin: 18% 0 0 0;
-  }
+  } */
 }
 
 .cd-main-nav {
@@ -298,7 +398,7 @@ Main components
     height: auto;
     line-height: normal;
     background: transparent;
-    padding: .3em 0.7em;
+    padding: 0.3em 0.7em;
     border-top: none;
     color: #4d4d4d;
     text-transform: uppercase;
@@ -306,7 +406,7 @@ Main components
     font-size: 0.875rem;
   }
   .no-touch .cd-main-nav a:hover {
-    color: #1C1D30;
+    color: #1c1d30;
     font-weight: 500;
   }
 }
@@ -316,39 +416,31 @@ Main components
   height: 100%;
   position: relative;
   z-index: 1;
+  margin-top: 40px;
 }
 
 /* 这里定义图片上的文字样式 */
 .picinfo {
-  position: absolute;
-  left: 50%;
-  bottom: 40px;
-  right: auto;
-  -webkit-transform: translateX(-50%);
-  -moz-transform: translateX(-50%);
-  -ms-transform: translateX(-50%);
-  -o-transform: translateX(-50%);
-  transform: translateX(-50%);
-  width: 90%;
   max-width: 900px;
+  margin: 0 auto;
   font-size: 30px;
   font-size: 1.875rem;
   text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
   color: white;
-
+  padding: 40px 20px;
+  box-sizing: border-box;
 }
 /* 图片文字简介 */
 .picinfo span {
   display: inline-block;
   line-height: 24px;
-  padding:10px 0 0 0;
+  padding: 10px 0 0 0;
   margin: 10px 0 0 0;
   font-size: 16px;
   border-top: 0.5px #ccc solid;
 }
 
-
-.cd-fixed-bg{
+.cd-fixed-bg {
   position: relative;
   min-height: 40%;
   background-size: cover;
@@ -356,7 +448,7 @@ Main components
   background-position: center center;
   z-index: 1;
 }
-.cd-footer-bg{
+.cd-footer-bg {
   position: relative;
   height: 500px;
   background-size: cover;
@@ -406,17 +498,18 @@ Main components
 }
 
 @media only screen and (min-width: 768px) {
-  .cd-fixed-bg h1, .cd-fixed-bg h2 {
+  .cd-fixed-bg h1,
+  .cd-fixed-bg h2 {
     font-size: 36px;
   }
-  .recruit li{
-    width: 20%!important;
+  .recruit li {
+    width: 20% !important;
   }
-  .newmedia{
+  .newmedia {
     width: 15% !important;
   }
-  .recruit{
-    justify-content: flex-start!important;
+  .recruit {
+    justify-content: flex-start !important;
   }
 }
 @media only screen and (min-width: 1170px) {
@@ -424,7 +517,8 @@ Main components
     background-attachment: fixed;
     background-attachment: scroll\9;
   }
-  .cd-fixed-bg h1, .cd-fixed-bg h2 {
+  .cd-fixed-bg h1,
+  .cd-fixed-bg h2 {
     font-size: 48px;
     font-weight: 300;
   }
@@ -439,7 +533,7 @@ Main components
   z-index: 2;
 }
 .cd-scrolling-bg.cd-color-1 {
-  color: #4D4D4D;
+  color: #4d4d4d;
 }
 .cd-scrolling-bg.cd-color-2 {
   background-color: #fff;
@@ -457,27 +551,29 @@ Main components
     font-weight: 300;
   }
 }
-.recruit{
+.recruit {
   width: 90%;
   margin-left: 20px;
 }
-.recruit-index{width: auto;}
-.recruit li{
+.recruit-index {
+  width: auto;
+}
+.recruit li {
   text-align: center;
   margin: 25px 0 0;
   height: 185px;
   float: left;
   width: 50%;
 }
-.recruit a{
+.recruit a {
   display: block;
   width: 120px;
   height: 120px;
   border-radius: 100%;
-  background: #0E5791;
+  background: #0e5791;
   font-family: Arial-Black;
   font-size: 26px;
-  color: #FFFFFF;
+  color: #ffffff;
   text-align: center;
   line-height: 120px;
   margin: 0 auto;
@@ -516,64 +612,69 @@ Main components
 .recruit a[attr^="jiaohu"]{
   background:#4D862C  ;
 }*/
-.job-n{
+.job-n {
   max-width: 120px;
   margin: 5px auto 0;
   text-align: center;
 }
-.newmedias{
+.newmedias {
   width: 90%;
   max-width: 800px;
-  overflow:hidden;
+  overflow: hidden;
   margin: 2em auto 0;
 }
-.programmer p{
+.programmer p {
   margin-top: 1em;
 }
-.online-application{
-  width:158px;
-  height:24px;
-  border-radius:2px;
-  border:1px solid rgba(224,224,224,1);
-  font-size:14px;
-  color:rgba(51,153,234,1);
-  line-height:20px;
+.online-application {
+  width: 158px;
+  height: 24px;
+  border-radius: 2px;
+  border: 1px solid rgba(224, 224, 224, 1);
+  font-size: 14px;
+  color: rgba(51, 153, 234, 1);
+  line-height: 20px;
   padding: 2px 8px;
   margin-left: 10px;
 }
-.chart-1{
+.chart-1 {
   display: block;
   width: 100%;
   max-width: 800px;
   margin: 2em auto 0;
 }
 /*job*/
-.job-title{
+.job-title {
   width: 100%;
-  background:url(../img/php.png) no-repeat center center;
+  background: url(../img/php.png) no-repeat center center;
   height: 240px;
   margin-top: 60px;
   background-size: cover;
 }
-.job-title h2{
+.job-title h2 {
   font-size: 24px;
-  color: #FFFFFF;
+  color: #ffffff;
   line-height: 24px;
   text-align: center;
   padding-top: 70px;
 }
-.job-recruit{
+.job-recruit {
   display: flex;
-   width: 100%;
+  width: 100%;
   margin-left: 0;
   flex-wrap: wrap;
 }
-.job-recruit-hot{width: 100%;height: 406px;overflow: hidden;
-  margin-left: 0;}
-.job-recruit p{
+.job-recruit-hot {
+  width: 100%;
+  height: 406px;
+  overflow: hidden;
+  margin-left: 0;
+}
+.job-recruit p {
   margin-top: 10px;
 }
-.job-recruit a,.job-recruit-hot a{
+.job-recruit a,
+.job-recruit-hot a {
   margin: 0;
   display: inline-block;
   background: none;
@@ -582,165 +683,377 @@ Main components
   height: auto;
   text-align: left;
   font-size: 24px;
-  color: #2D2D2D;
+  color: #2d2d2d;
+}
+.job-recruit-hot a {
+  font-size: 16px;
+  color: #3d3d3d;
+  line-height: 25px;
+}
+.job-recruit a:hover {
+  color: #2d2d2d;
+  text-decoration: none;
 }
-.job-recruit-hot a{font-size: 16px;color: #3D3D3D;line-height: 25px}
-.job-recruit a:hover{color: #2D2D2D;text-decoration: none}
 
-.job-contain h2{
+.job-contain h2 {
   font-size: 18px;
-  color: #2E2E2E;
+  color: #2e2e2e;
   line-height: 25px;
   font-weight: 500;
   margin: 0 0 16px;
 }
-.job-contain .job_name_area{margin: 0;overflow: hidden}
-.job-contain .job_name_area img{vertical-align: middle;margin-right: 16px;float: left;width: 48px;height: 48px;border-radius: 4px;border: none; }
-.job-contain h2.job-name-dec {float: left;width: calc(100% - 72px);margin-top: 3px; font-size: 24px;color: #2D2D2D;margin-bottom: 6px;}
-.job-contain .job_name_area span{display: inline-block;margin-top: 3px;margin-bottom: 30px; color: #6B6B6B;font-size: 12px}
-.job-contain h2.gwzz{background: url("../img/icon_gw-new.png") no-repeat left center;padding-left: 27px;background-size: 20px}
-.job-contain h2.rzyq{background: url("../img/icon_rz-new.png") no-repeat left center;padding-left: 27px;background-size: 20px}
-.job-contain h2.jfx{background: url("../img/icon_jf-new.png") no-repeat left center;padding-left: 27px;background-size: 20px}
-.job-contain h2.tgzl{background: url("../img/icon_tg.png") no-repeat left center;padding-left: 27px;background-size: 20px}
-.job-contain h2.lxfs{background: url("../img/icon_lx-new.png") no-repeat left center;padding-left: 27px;background-size: 20px}
-.jobs_other h2.qtzw{font-size: 18px;color: #2D2D2D;line-height: 25px;font-weight: 500;margin-bottom: 20px}
+.job-contain .job_name_area {
+  margin: 0;
+  overflow: hidden;
+}
+.job-contain .job_name_area img {
+  vertical-align: middle;
+  margin-right: 16px;
+  float: left;
+  width: 48px;
+  height: 48px;
+  border-radius: 4px;
+  border: none;
+}
+.job-contain h2.job-name-dec {
+  float: left;
+  width: calc(100% - 72px);
+  margin-top: 3px;
+  font-size: 24px;
+  color: #2d2d2d;
+  margin-bottom: 6px;
+}
+.job-contain .job_name_area span {
+  display: inline-block;
+  margin-top: 3px;
+  margin-bottom: 30px;
+  color: #6b6b6b;
+  font-size: 12px;
+}
+.job-contain h2.gwzz {
+  background: url("../img/icon_gw-new.png") no-repeat left center;
+  padding-left: 27px;
+  background-size: 20px;
+}
+.job-contain h2.rzyq {
+  background: url("../img/icon_rz-new.png") no-repeat left center;
+  padding-left: 27px;
+  background-size: 20px;
+}
+.job-contain h2.jfx {
+  background: url("../img/icon_jf-new.png") no-repeat left center;
+  padding-left: 27px;
+  background-size: 20px;
+}
+.job-contain h2.tgzl {
+  background: url("../img/icon_tg.png") no-repeat left center;
+  padding-left: 27px;
+  background-size: 20px;
+}
+.job-contain h2.lxfs {
+  background: url("../img/icon_lx-new.png") no-repeat left center;
+  padding-left: 27px;
+  background-size: 20px;
+}
+.jobs_other h2.qtzw {
+  font-size: 18px;
+  color: #2d2d2d;
+  line-height: 25px;
+  font-weight: 500;
+  margin-bottom: 20px;
+}
 
-.job-contain li,.job-contain p{color: #909090;line-height: 30px;font-size: 14px;font-weight: 400;}
+.job-contain li,
+.job-contain p {
+  color: #909090;
+  line-height: 30px;
+  font-size: 14px;
+  font-weight: 400;
+}
 
-.job-recruit li,.job-recruit-hot li{
+.job-recruit li,
+.job-recruit-hot li {
   text-align: left;
-  width: 100%!important;
+  width: 100% !important;
   float: none;
   height: auto;
   margin: 0;
-
 }
-.job-recruit-hot li{padding-bottom: 16px;margin-bottom: 16px;border-bottom: 1px solid #E0E0E0;}
-.job-recruit  p.jobs_area_dec,.job-recruit-hot  p.jobs_area_dec,.recruit-index p.jobs_area_dec{margin: 3px 0 0;color: #6B6B6B;font-size: 12px}
-.job-recruit  p.job-d{margin: 18px 0 0;color: #4D4D4D;font-size: 14px;line-height: 25px;display: none}
-.job-recruit li,.recruit-index li{padding-bottom: 12px;margin-bottom: 12px;border-bottom: 1px solid #E0E0E0}
-.recruit-index li{overflow: hidden}
-.job-recruit li img,.recruit-index li img{margin-right: 12px;float: left;width: 48px;height: 48px;}
-.jobs_right{float: left;width: calc(100% - 60px);height: auto}
-.job-recruit{height: 515px;overflow: hidden;}
-.btn_box{text-align: center;margin-top: 32px;}
-.btn_box a{display: block; font-size: 24px;color: #1C1D30;line-height: 33px;}
-.send-resume{
+.job-recruit-hot li {
+  padding-bottom: 16px;
+  margin-bottom: 16px;
+  border-bottom: 1px solid #e0e0e0;
+}
+.job-recruit p.jobs_area_dec,
+.job-recruit-hot p.jobs_area_dec,
+.recruit-index p.jobs_area_dec {
+  margin: 3px 0 0;
+  color: #6b6b6b;
+  font-size: 12px;
+}
+.job-recruit p.job-d {
+  margin: 18px 0 0;
+  color: #4d4d4d;
+  font-size: 14px;
+  line-height: 25px;
+  display: none;
+}
+.job-recruit li,
+.recruit-index li {
+  padding-bottom: 12px;
+  margin-bottom: 12px;
+  border-bottom: 1px solid #e0e0e0;
+}
+.recruit-index li {
+  overflow: hidden;
+}
+.job-recruit li img,
+.recruit-index li img {
+  margin-right: 12px;
+  float: left;
+  width: 48px;
+  height: 48px;
+}
+.jobs_right {
+  float: left;
+  width: calc(100% - 60px);
+  height: auto;
+}
+.job-recruit {
+  height: 515px;
+  overflow: hidden;
+}
+.btn_box {
+  text-align: center;
+  margin-top: 32px;
+}
+.btn_box a {
+  display: block;
+  font-size: 24px;
+  color: #1c1d30;
+  line-height: 33px;
+}
+.send-resume {
   display: block;
   width: 120px;
   height: 40px;
-  background: #FC5531;
+  background: #fc5531;
   border-radius: 20px;
   font-size: 14px;
-  color: #FFFFFF;
+  color: #ffffff;
   text-align: center;
   line-height: 40px;
   margin: 20px auto 0;
 }
-.container-nav,.container,.footer-logo{
-  width:100%;
+.container-nav,
+.container,
+.footer-logo {
+  width: 100%;
   max-width: 900px;
   margin: 0 auto;
   overflow: hidden;
   height: 100%;
 }
-.jobs_dec,.jobs_other {background-color: #fff}
-.jobs_other{margin-top: 8px;}
-.job-describe .container{max-width: 1180px;padding: 15px 20px}
-.container-nav{
+.jobs_dec,
+.jobs_other {
+  background-color: #fff;
+}
+.jobs_other {
+  margin-top: 8px;
+}
+.job-describe .container {
+  max-width: 1180px;
+  padding: 15px 20px;
+}
+.container-nav {
   max-width: 1200px;
 }
-.footer-img{
-  display:block;
+.footer-img {
+  display: block;
   width: 192px;
-  margin:23px auto 0;
+  margin: 23px auto 0;
 }
-.job-contain ol{
+.job-contain ol {
   list-style: decimal inside;
   padding-bottom: 16px;
   margin-bottom: 16px;
-  border-bottom: 1px solid #E0E0E0;
+  border-bottom: 1px solid #e0e0e0;
 }
-.medias .newmedia{
+.medias .newmedia {
   width: 162px;
-  height:192px;
+  height: 192px;
 }
-.medias .newmedia img{
-  width:100%;
+.medias .newmedia img {
+  width: 100%;
   max-width: 162px;
-  height:100%;
+  height: 100%;
   max-height: 155px;
 }
-.persion_article{
+.persion_article {
   width: 300px;
   margin: 0 auto 0;
 }
-.hot_jobs{display: none}
-.hot_jobs h3{margin-bottom: 16px; padding-bottom: 32px;border-bottom: 1px solid #E0E0E0;color:#2E2E2E; ;font-size: 18px;}
+.hot_jobs {
+  display: none;
+}
+.hot_jobs h3 {
+  margin-bottom: 16px;
+  padding-bottom: 32px;
+  border-bottom: 1px solid #e0e0e0;
+  color: #2e2e2e;
+  font-size: 18px;
+}
 
 @media only screen and (min-width: 768px) {
-  .medias .newmedia{
-    width: 22%!important;
+  .medias .newmedia {
+    width: 22% !important;
   }
-  .persion_article{
+  .persion_article {
     float: right;
     margin-top: 7px;
     margin-right: 20px;
   }
-  .footer-img{
+  .footer-img {
     display: inline;
-    margin:213px 0 0 85px;
-  }
-  .job-title h2{font-size: 36px;padding-top: 50px;line-height: 50px}
-  .job-contain .job_name_area span{margin-bottom: 44px;}
-  .job-describe .jobs_dec,.job-describe .jobs_other{padding: 40px;background-color: #fff;margin-top: -60px;border-radius:4px;}
-  .job-describe .jobs_other{margin-top: 16px;}
-  .job-contain{float: left;width: calc(100% - 308px)}
-  .hot_jobs{display: block; float: left;width: 250px;margin-left: 58px}
-  .job-contain ol{ margin-left: 72px; margin-bottom: 32px;padding-bottom: 32px;}
-  .job-contain li{line-height: 25px;font-size: 16px;}
-  .job-contain p{margin-left: 72px;line-height: 25px;font-size: 16px;}
-/*  .job-contain p span{margin-right: 80px}
-*/  .job-contain h2.gwzz,.job-contain h2.rzyq,.job-contain h2.jfx,.job-contain h2.tgzl,.job-contain h2.lxfs,.job-contain h2.qtzw{margin-left: 45px;}
-  .send-resume{margin-left: 72px}
-  .jobs_other h2.qtzw{margin-bottom: 40px}
-  .send-resume{font-size: 18px;margin: 32px 0 0px 72px}
-  .job-recruit p.job-d{display: block}
-  .job-recruit li img,.job-contain .job_name_area img{width: 56px;height: 56px;margin-right: 16px;}
-  .jobs_right{width: calc(100% - 72px);padding-bottom: 32px; margin-bottom: 32px;  height: auto;
-    border-bottom: 1px solid #E0E0E0;}
-  .job-recruit li,.recruit-index li{padding-bottom: 0;margin-bottom: 0;border-bottom: none;}
-  .recruit-index{overflow: hidden}
-  .recruit-index li{float: left;width: 33.33%}
-  .recruit-index li:nth-last-child(1) .jobs_right,.recruit-index li:nth-last-child(2) .jobs_right,.recruit-index li:nth-last-child(3) .jobs_right,.recruit-index li:nth-last-child(4) .jobs_right{border-bottom: none;}
-  .recruit-index .jobs_right{padding-bottom: 16px;margin-bottom: 16px;}
+    margin: 213px 0 0 85px;
+  }
+  .job-title h2 {
+    font-size: 36px;
+    padding-top: 50px;
+    line-height: 50px;
+  }
+  .job-contain .job_name_area span {
+    margin-bottom: 44px;
+  }
+  .job-describe .jobs_dec,
+  .job-describe .jobs_other {
+    padding: 40px;
+    background-color: #fff;
+    margin-top: -60px;
+    border-radius: 4px;
+  }
+  .job-describe .jobs_other {
+    margin-top: 16px;
+  }
+  .job-contain {
+    float: left;
+    width: calc(100% - 308px);
+  }
+  .hot_jobs {
+    display: block;
+    float: left;
+    width: 250px;
+    margin-left: 58px;
+  }
+  .job-contain ol {
+    margin-left: 72px;
+    margin-bottom: 32px;
+    padding-bottom: 32px;
+  }
+  .job-contain li {
+    line-height: 25px;
+    font-size: 16px;
+  }
+  .job-contain p {
+    margin-left: 72px;
+    line-height: 25px;
+    font-size: 16px;
+  }
+  /*  .job-contain p span{margin-right: 80px}
+*/
+  .job-contain h2.gwzz,
+  .job-contain h2.rzyq,
+  .job-contain h2.jfx,
+  .job-contain h2.tgzl,
+  .job-contain h2.lxfs,
+  .job-contain h2.qtzw {
+    margin-left: 45px;
+  }
+  .send-resume {
+    margin-left: 72px;
+  }
+  .jobs_other h2.qtzw {
+    margin-bottom: 40px;
+  }
+  .send-resume {
+    font-size: 18px;
+    margin: 32px 0 0px 72px;
+  }
+  .job-recruit p.job-d {
+    display: block;
+  }
+  .job-recruit li img,
+  .job-contain .job_name_area img {
+    width: 56px;
+    height: 56px;
+    margin-right: 16px;
+  }
+  .jobs_right {
+    width: calc(100% - 72px);
+    padding-bottom: 32px;
+    margin-bottom: 32px;
+    height: auto;
+    border-bottom: 1px solid #e0e0e0;
+  }
+  .job-recruit li,
+  .recruit-index li {
+    padding-bottom: 0;
+    margin-bottom: 0;
+    border-bottom: none;
+  }
+  .recruit-index {
+    overflow: hidden;
+  }
+  .recruit-index li {
+    float: left;
+    width: 33.33%;
+  }
+  .recruit-index li:nth-last-child(1) .jobs_right,
+  .recruit-index li:nth-last-child(2) .jobs_right,
+  .recruit-index li:nth-last-child(3) .jobs_right,
+  .recruit-index li:nth-last-child(4) .jobs_right {
+    border-bottom: none;
+  }
+  .recruit-index .jobs_right {
+    padding-bottom: 16px;
+    margin-bottom: 16px;
+  }
 }
 
 @media only screen and (min-width: 992px) {
-  .recruit-index li{width: 25%}
-
+  .recruit-index li {
+    width: 25%;
+  }
 }
-.layer-img{
+.layer-img {
   float: right;
   margin-top: 15px;
 }
-.layer-p{
+.layer-p {
   font-size: 1.5em;
 }
-.job-recruit .job-n,.job-recruit-hot .job-n,.recruit-index .job-n{
-  margin:3px 0 0;
+.job-recruit .job-n,
+.job-recruit-hot .job-n,
+.recruit-index .job-n {
+  margin: 3px 0 0;
   text-align: left;
-  max-width:inherit;
+  max-width: inherit;
   line-height: 33px;
 }
-.recruit-index .job-n{line-height: 22px;margin-top: 0}
-.job-recruit .job-n{font-size: 18px;font-weight: 600}
-
+.recruit-index .job-n {
+  line-height: 22px;
+  margin-top: 0;
+}
+.job-recruit .job-n {
+  font-size: 18px;
+  font-weight: 600;
+}
 
-.cd-fixed-bg h1, .cd-fixed-bg h2 {
-  padding-top: 168px;
+.cd-fixed-bg h1,
+.cd-fixed-bg h2 {
+  /* padding-top: 168px; */
 }
 
 .csdn-pub-footer {
   padding: 24px 0 0;
-}
\ No newline at end of file
+}

src/index.html

@@ -22,6 +22,7 @@
   <![endif]-->
   <title>GitCode 一亿人的安全代码仓</title>
 </head>
+
 <body>
   <header class="cd-header header">
     <div class="container-nav">
@@ -30,6 +31,34 @@
           <img src="img/new.png" alt="Logo">
         </a>
       </div>
+      <ul class="menu">
+        <li>
+          <a href="https://gitcode.net/explore/welcome">
+            首页
+          </a>
+        </li>
+        <li>
+          <a href="https://gitcode.net/courses">
+            学习广场
+          </a>
+        </li>
+        <li class="m-d-none">
+          <a href="https://gitcode.net/lives">
+            开源秀
+          </a>
+        </li>
+        <li>
+          <a href="https://gitcode.net/explore/projects/starred">项目</a>
+        </li>
+        <li> 
+          <a href="https://gitcode.net/explore/groups">组织</a>
+        </li>
+        <li class="m-d-none" style="padding: 0;margin-left: 32px;">
+          <div class="input_box">
+            <input id="header-search" type="text" placeholder="搜索或转到…">
+          </div>
+        </li>
+      </ul>
   </header>
   </div>
   <main class="cd-main-content" id="csdn-previewimg-box">
@@ -37,9 +66,10 @@
       <div class="picinfo" id="about">
         <h1>GitCode</h1>
         <span>
-        <p style="font-size:24px;color:#FF6C46;">一亿人的安全代码仓</p> <br>
-        <p style="font-size:20px">源码级别的安全分析 & 协议分析平台 </p><br>
-          GitCode 是 CSDN 为开发者提供的开源项目创新服务平台，秉承“创新、开放、协作、共享”的开源价值观，致力于为大规模开源开放协同创新助力赋能，打造创新成果孵化和新时代开发者培养的开源创新生态！支持公有云使用、私有化部署以及软硬一体化私有部署。
+          <p style="font-size:24px;color:#FF6C46;">一亿人的安全代码仓</p> <br>
+          <p style="font-size:20px">源码级别的安全分析 & 协议分析平台 </p><br>
+          GitCode 是 CSDN
+          为开发者提供的开源项目创新服务平台，秉承“创新、开放、协作、共享”的开源价值观，致力于为大规模开源开放协同创新助力赋能，打造创新成果孵化和新时代开发者培养的开源创新生态！支持公有云使用、私有化部署以及软硬一体化私有部署。
         </span>
       </div>
     </div>
@@ -118,25 +148,26 @@
             只有所有权人才能取走</br>不能修改不能删除</br>只能增量上传
           </div>
         </div>
-        </div>
       </div>
     </div>
     </div>
+    </div>
     <div class="cd-scrolling-bg cd-color-1">
       <div class="cd-container programmer">
         <h2><b>简单高效的工作方式</b></h2>
+        <div class="digitalinfo2-container">
         <div class="csdn-digitalinfo2">
           <div style="color: #ff3b3f;" class="title">
             管理
           </div>
           <div style="color: #4D4D4D;" class="content">
             <ul>
-            <li>子组织管理</li>
-            <li>审计事件</li>
-            <li>审计报告</li>
-            <li>合规管理</li>
-            <li>DevOps报告</li>
-            <li>价值流管理</li>
+              <li>子组织管理</li>
+              <li>审计事件</li>
+              <li>审计报告</li>
+              <li>合规管理</li>
+              <li>DevOps报告</li>
+              <li>价值流管理</li>
             </ul>
           </div>
         </div>
@@ -146,12 +177,12 @@
           </div>
           <div style="color: #4D4D4D;" class="content">
             <ul>
-            <li>团队计划</li>
-            <li>资源管理</li>
-            <li>服务台</li>
-            <li>需求管理</li>
-            <li>质量管理</li>
-            <li>设计管理</li>
+              <li>团队计划</li>
+              <li>资源管理</li>
+              <li>服务台</li>
+              <li>需求管理</li>
+              <li>质量管理</li>
+              <li>设计管理</li>
             </ul>
           </div>
         </div>
@@ -161,12 +192,12 @@
           </div>
           <div style="color: #4D4D4D;" class="content">
             <ul>
-            <li>源代码管理</li>
-            <li>代码审查</li>
-            <li>Wiki</li>
-            <li>Web IDE</li>
-            <li>Live浏览</li>
-            <li>代码片段</li>
+              <li>源代码管理</li>
+              <li>代码审查</li>
+              <li>Wiki</li>
+              <li>Web IDE</li>
+              <li>Live浏览</li>
+              <li>代码片段</li>
             </ul>
           </div>
         </div>
@@ -176,9 +207,9 @@
           </div>
           <div style="color: #4D4D4D;" class="content">
             <ul>
-            <li>持续集成 (CI)</li>
-            <li>代码测试与覆盖</li>
-            <li>合并队列</li>
+              <li>持续集成 (CI)</li>
+              <li>代码测试与覆盖</li>
+              <li>合并队列</li>
             </ul>
           </div>
         </div>
@@ -188,8 +219,8 @@
           </div>
           <div style="color: #4D4D4D;" class="content">
             <ul>
-            <li>发布包管理</li>
-            <li>大文件存储</li>
+              <li>发布包管理</li>
+              <li>大文件存储</li>
             </ul>
           </div>
         </div>
@@ -199,8 +230,8 @@
           </div>
           <div style="color: #4D4D4D;" class="content">
             <ul>
-            <li>代码质量</li>
-            <li>缺陷管理</li>
+              <li>代码质量</li>
+              <li>缺陷管理</li>
             </ul>
           </div>
         </div>
@@ -210,10 +241,10 @@
           </div>
           <div style="color: #4D4D4D;" class="content">
             <ul>
-            <li>Release Evidence</li>
-            <li>流水线（Pipe）</li>
-            <li>持续部署（CD）</li>
-            <li>Pages</li>
+              <li>Release Evidence</li>
+              <li>流水线（Pipe）</li>
+              <li>持续部署（CD）</li>
+              <li>Pages</li>
             </ul>
           </div>
         </div>
@@ -223,20 +254,20 @@
           </div>
           <div style="color: #4D4D4D;" class="content">
             <ul>
-            <li>Auto DevOps</li>
+              <li>Auto DevOps</li>
             </ul>
           </div>
         </div>
-        
+      </div>
         <h2>行业解决方案</h2>
-          <p style="color: #ff3b3f;font-size:18px;">开源教学研解决方案</p>
-          <li style="color: #4D4D4D;">为教学研提供专业解决方案，维护国际知名开源项目的本土化知识库、开源技术栈路线图等内容，帮助初学者在开源领域成长</li>
-          <p style="color: #ff3b3f;font-size:18px;">开源运营需求</p>
-          <li style="color: #4D4D4D;">借助csdn 的运营能力，打造开源项目的新生态</li>
-          <p style="color: #ff3b3f;font-size:18px;">国家级开源活动</p>
-          <li style="color: #4D4D4D;">承接国家级的开源评选以及开源大赛</li>
-        
-        <h2>GitCode 大事记</h2>
+        <p style="color: #ff3b3f;font-size:18px;">开源教学研解决方案</p>
+        <li style="color: #4D4D4D;">为教学研提供专业解决方案，维护国际知名开源项目的本土化知识库、开源技术栈路线图等内容，帮助初学者在开源领域成长</li>
+        <p style="color: #ff3b3f;font-size:18px;">开源运营需求</p>
+        <li style="color: #4D4D4D;">借助csdn 的运营能力，打造开源项目的新生态</li>
+        <p style="color: #ff3b3f;font-size:18px;">国家级开源活动</p>
+        <li style="color: #4D4D4D;">承接国家级的开源评选以及开源大赛</li>
+
+        <h2 style="margin-bottom: 20px">GitCode 大事记</h2>
         <h4>2020年09月 推出代码托管平台 CodeChina</h4>
         <!-- <p>CODE CHINA是CSDN为开发者提供的代码托管平台，开发者和企业可以托管、运营、推广自己的开源项目，也可以
         托管自己的私有代码仓库。平台提供完善的源代码管理功能及开源协作功能，包括Issue，WIKI，Pages，代码片，
@@ -260,69 +291,73 @@
           <p>CODE Network：面向全球开发者社群的协作平台，开发者、用户和贡献者被通证连接和激励，形成分布式协作组织（DCO）。DCO可在其上完成团队创建、通证发行、融资、销售和权益分配，基于通证的激励机制共同开发软件、创作产品、传播知识，以新的协作组织模式创造新的科技与智慧成果，并获取和公平的分配收益。</p> -->
         <h2>常用链接</h2>
         <p style="color: #ff3b3f;font-size:18px;">博客</p>
-        <p style="color: #4D4D4D;"><a href="https://gitcode.blog.csdn.net/" target="_blank">https://gitcode.blog.csdn.net/</a></p>
+        <p style="color: #4D4D4D;"><a href="https://gitcode.blog.csdn.net/"
+            target="_blank">https://gitcode.blog.csdn.net/</a></p>
         <p style="color: #ff3b3f;font-size:18px;">社区</p>
-        <p style="color: #4D4D4D;"><a href="https://bbs.csdn.net/forums/opensource?category=0" target="_blank">https://bbs.csdn.net/forums/opensource</a></p>
+        <p style="color: #4D4D4D;"><a href="https://bbs.csdn.net/forums/opensource?category=0"
+            target="_blank">https://bbs.csdn.net/forums/opensource</a></p>
         <p style="color: #ff3b3f;font-size:18px;">新闻资讯</p>
-        <p style="color: #4D4D4D;"><a href="https://gitcode.net/explore" target="_blank">https://gitcode.net/explore</a></p>
+        <p style="color: #4D4D4D;"><a href="https://gitcode.net/explore" target="_blank">https://gitcode.net/explore</a>
+        </p>
         <p style="color: #ff3b3f;font-size:18px;">Quicker 客户端</p>
         <p style="color: #4D4D4D;">暂无</p>
         <p style="color: #ff3b3f;font-size:18px;">文档翻译计划</p>
         <p style="color: #4D4D4D;">暂无</p>
         <p style="color: #ff3b3f;font-size:18px;">加入我们</p>
-        <p style="color: #4D4D4D;"><a href="https://www.csdn.net/company/index.html#recruit" target="_blank">https://www.csdn.net/company/index.html#recruit</a></p>
+        <p style="color: #4D4D4D;"><a href="https://www.csdn.net/company/index.html#recruit"
+            target="_blank">https://www.csdn.net/company/index.html#recruit</a></p>
         <h2 id="train">我们的合作伙伴</h2>
-        <p>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">开源软件推进联盟</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">华为</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">百度</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">阿里</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">腾讯</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">浪潮</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">优麒麟</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">旷视</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">开放原子教育</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">小米</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">网易</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">字节跳动</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">京东</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">58</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">Apache 基金会</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">Linux AI 基金会</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">PingCAP</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">一流科技</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">翼辉信息</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">OpenCV</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">青云</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">携程</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">海信研发中心</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">OpenHarmony</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">Openeuler</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">RT-Thread</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">MindSpore</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">飞腾</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">香山处理器</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">DCloud </span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">Wechaty</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">Kylin</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">Chatopera</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">JustAuth</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">Sureness</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">OpenDILab开源决策智能平台</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">Koderover</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">上电科</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">云鲸智能AckyStack</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">Duckula</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">程序员联盟</span></br>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">DLOU-CV</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">Fedora工作站中国研究小组</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">Unity3D</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">Jenkins 中文社区</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">Vscode</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">OpenOffice</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">CNTT</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">Exceliz</span>
-          <span style="color: #4d4d4d;font-size:18px;padding:20px 24px 20px 0px;">闽江学院</span>
+        <p class="partner">
+          <span>开源软件推进联盟</span>
+          <span>华为</span>
+          <span>百度</span>
+          <span>阿里</span>
+          <span>腾讯</span>
+          <span>浪潮</span>
+          <span>优麒麟</span>
+          <span>旷视</span>
+          <span>开放原子教育</span>
+          <span>小米</span>
+          <span>网易</span>
+          <span>字节跳动</span>
+          <span>京东</span>
+          <span>58</span>
+          <span>Apache 基金会</span>
+          <span>Linux AI 基金会</span>
+          <span>PingCAP</span>
+          <span>一流科技</span>
+          <span>翼辉信息</span>
+          <span>OpenCV</span>
+          <span>青云</span>
+          <span>携程</span>
+          <span>海信研发中心</span>
+          <span>OpenHarmony</span>
+          <span>Openeuler</span>
+          <span>RT-Thread</span>
+          <span>MindSpore</span>
+          <span>飞腾</span>
+          <span>香山处理器</span>
+          <span>DCloud </span>
+          <span>Wechaty</span>
+          <span>Kylin</span>
+          <span>Chatopera</span>
+          <span>JustAuth</span>
+          <span>Sureness</span>
+          <span>OpenDILab开源决策智能平台</span>
+          <span>Koderover</span>
+          <span>上电科</span>
+          <span>云鲸智能AckyStack</span>
+          <span>Duckula</span>
+          <span>程序员联盟</span></br>
+          <span>DLOU-CV</span>
+          <span>Fedora工作站中国研究小组</span>
+          <span>Unity3D</span>
+          <span>Jenkins 中文社区</span>
+          <span>Vscode</span>
+          <span>OpenOffice</span>
+          <span>CNTT</span>
+          <span>Exceliz</span>
+          <span>闽江学院</span>
         </p>
       </div>
       <!-- cd-container -->
@@ -347,8 +382,9 @@
         <p>Email：gitcode@csdn.net</p>
         <h2>Issue 反馈</h2>
         <p>
-          <p style="color: #4D4D4D;"><a href="https://gitcode.net/gitcode/help-docs/-/issues" target="_blank">https://gitcode.net/gitcode/help-docs/-/issues</a></p>
-          <!-- <a href="https://ads.csdn.net" target="_blank" class="online-application">在线广告发布服务申请</a> -->
+        <p style="color: #4D4D4D;"><a href="https://gitcode.net/gitcode/help-docs/-/issues"
+            target="_blank">https://gitcode.net/gitcode/help-docs/-/issues</a></p>
+        <!-- <a href="https://ads.csdn.net" target="_blank" class="online-application">在线广告发布服务申请</a> -->
         </p>
       </div>
     </div>
@@ -366,6 +402,13 @@
         e.stopPropagation();
       });
     });
+
+    $('#header-search').on('keydown',function(e) {
+      if(e.keyCode === 13) {
+        location.href = `https://gitcode.net/search?utf8=%E2%9C%93&search=${$(this).val()}&group_id=&project_id=&snippets=false&repository_ref=&nav_source=navbar`
+      }
+    })
   </script>
 </body>
-</html>
+
+</html>
\ No newline at end of file