前端应用文章模块并显示

public/static/css/style.css

@@ -266,6 +266,7 @@ body {
 
 /* 轮播动画 */
 @keyframes slide {
+
   0%,
   33% {
     transform: translateX(0);
@@ -348,7 +349,7 @@ body {
 .tab-header {
   display: flex;
   align-items: center;
-  gap: 10px;
+  gap: 20px;
 }
 
 .tab-header .active {
@@ -362,9 +363,13 @@ body {
 }
 
 .tab-content.active {
-  display: block;
   opacity: 1;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 20px;
+  justify-content: flex-start;
 }
+
 .tab-item {
   cursor: pointer;
 }
@@ -484,4 +489,4 @@ body {
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
-}
+}