新媒体矩阵样式

nngkxxdp/src/main/resources/static/xmtjz/css/index.css

@@ -160,6 +160,7 @@
 .first .left .list li .arrow {
     width: 0;
     height: 0;
+    opacity: 0;
     border-top: 22px solid transparent;
     border-bottom: 22px solid transparent;
     border-right: 22px solid #F2F9FF;
@@ -300,8 +301,17 @@ line-height: 24px;
 }
 .second .mokuai1 .top{
     margin:22px 0 0px 22px;
+    margin-bottom: 20px;
     width: 265px;
-    height: 90px;
+    height: 71px;
+    display: -webkit-box;
+    font-size: 18px;
+    line-height: 23px;
+    -webkit-line-clamp: 3; /*最多显示5行*/
+    overflow: hidden;
+    text-overflow: ellipsis;
+    -webkit-box-orient: vertical;
+    word-break: break-all; /*强制英文单词自动换行*/
 }
 .mokuai1 .center .left{
     font-size: 16px;
@@ -585,4 +595,16 @@ line-height: 24px;
     font-weight: 400;
     color: #999999;
     margin-bottom: 24px;
+}
+
+.line-limit-2 {
+    display: -webkit-box;
+    font-size: 18px;
+    line-height: 20px;
+    height: 40px;
+    -webkit-line-clamp: 2; /*最多显示5行*/
+    overflow: hidden;
+    text-overflow: ellipsis;
+    -webkit-box-orient: vertical;
+    word-break: break-all; /*强制英文单词自动换行*/
 }

nngkxxdp/src/main/resources/static/xmtjz/js/index.js

@@ -12,7 +12,7 @@ function getajaxTop(params, path) {
                     res.data.splice(7);
                 }
                 res.data.forEach((item) => {
-                    liText += `<li><span onclick="openUrl('${item.url}')">${item.title}</span><img src="data:${item.cover}" alt=""></li>`;
+                    liText += `<li><span class='line-limit-2' onclick="openUrl('${item.url}')">${item.title}</span><img src="data:${item.cover}" alt=""></li >`;
                 });
                 console.log(res.data[0].cover)
                 var htmlText = "<img src='data:" + res.data[0].cover + "');' alt='' class='img'>" +