新闻详情页

src/scrm_pages/newsDetail/newsDetail.vue

@@ -1,6 +1,9 @@
 <template>
   <div>
-    <div class="newsTitle">山东潍坊，高考还剩最后一门，女孩却被同学杀死了</div>
+    <div class="newsTitle">山东潍坊，高考还剩最后一门，女孩却被同学杀死了湾半岛，与香港隔海相望，西依珠江口，背靠大南山,拥有得天独厚的地理位置</div>
+    <div
+      class="msg"
+    >蛇口位于深圳湾半岛，与香港隔海相望，西依珠江口，背靠大南山,拥有得天独厚的地理位置；作为改革开放的前沿阵地，经过数十年的发展，如今已成为一个融合居住与旅游、本土与国际、富饶与休闲的国际化城区，区域内集中了鲸山别墅九期、双玺花园、兰溪谷等一系列高尚住宅，聚集着一大批具有高品质生活、高消费能力的优质人群，同时也吸引了来自70多个国家和地区，占深圳市60%以上的外籍人士聚居于此，拥有“</div>
   </div>
 </template>
 
@@ -8,13 +11,26 @@
 
 <style lang="scss" scoped>
 .newsTitle {
-  width: 319px;
-
-  height: 50px;
-  font-size: 20px;
-  font-family: PingFangSC;
-  font-weight: 400;
+  width: 19.9375rem;
+  height: 3.75rem;
+  font-size: 1.25rem;
+  font-weight: 600;
+  color: rgba(7, 18, 40, 1);
+  line-height: 1.875rem;
+  margin: 1.3125rem 2.1875rem 0 1.3125rem;
+  word-break: break-all;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+}
+.msg {
+  width: 21rem;
+  height: 12.0625rem;
+  font-size: 1rem;
+  font-weight: 600;
   color: rgba(7, 18, 40, 1);
-  line-height: 30px;
+  line-height: 1.375rem;
+  margin: 1.25rem 1.25rem 0 1.125rem;
 }
 </style>