提交 421bac40 作者: 吴佳伟

fix: 新闻标题超出部分使用...代替

上级 ecfb8cb1
......@@ -120,7 +120,7 @@
@click="toNewsDetail(news)"
>
<view class="flex flex-col justify-between" :class="news.image ? 'w-70%' : 'w-full'">
<view class="text-28 color-#333333">{{ news.title }}</view>
<view class="ellipsis-multiline text-28 color-#333333">{{ news.title }}</view>
<view class="flex flex-row justify-between text-25 color-#686868">
<text>{{ news.publishDate }}</text>
<view class="mr-1 flex-center">
......@@ -171,4 +171,12 @@
color: #999;
font-size: 28rpx;
}
.ellipsis-multiline {
display: -webkit-box; /* 必须 */
-webkit-box-orient: vertical; /* 垂直排列 */
-webkit-line-clamp: 2; /* 限制显示3行 */
overflow: hidden; /* 隐藏超出内容 */
text-overflow: ellipsis; /* 可选,部分浏览器不生效 */
}
</style>
......@@ -710,7 +710,7 @@
@click="toNewsDetail(news)"
>
<view class="w-70% flex flex-col justify-between" :class="news.image ? 'w-70%' : 'w-full'">
<view class="text-25 color-#333333 mb-1">{{ news.title }}</view>
<view class="ellipsis-multiline text-25 color-#333333 mb-1">{{ news.title }}</view>
<view class="text-25 color-#686868">{{
dayjs(news.publishDate).format('YYYY年MM月DD日')
}}</view>
......@@ -1733,4 +1733,11 @@
padding: unset !important;
font-size: 28rpx;
}
.ellipsis-multiline {
display: -webkit-box; /* 必须 */
-webkit-box-orient: vertical; /* 垂直排列 */
-webkit-line-clamp: 2; /* 限制显示3行 */
overflow: hidden; /* 隐藏超出内容 */
text-overflow: ellipsis; /* 可选,部分浏览器不生效 */
}
</style>
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论