文字多余省略...

牛油的果

已于 2024-04-21 22:19:31 修改

阅读量72

点赞数

分类专栏： css 文章标签： css 前端

于 2023-06-12 14:43:53 首次发布

本文链接：https://blog.csdn.net/weixin_57633124/article/details/131168452

版权

css 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

文章介绍了如何使用CSS实现文本超出部分显示省略号的效果，具体涉及text-overflow、overflow和white-space属性。此外，对于uni-app环境，提到了使用变量.substring(0,8)+...的方法来限制显示的字符数。

摘要由CSDN通过智能技术生成

css中加代码

text-overflow: ellipsis;
overflow: hidden;
white-space: normal;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;

请根据所需调整 ~ ~ ~

类似效果(这里的 -webkit-line-clamp: 2;)

1.uniapp中可以用变量.substring(0,8)+"..."

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

牛油的果

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

微信小程序实现指定显示行数多余文字去掉用省略号代替

10-18

在微信小程序开发中，实现指定显示行数并用省略号代替超出的多余文字是一种常见的文本显示需求。当文本内容超出特定范围时，通常希望以一种优雅的方式显示给用户，比如显示固定行数的文字，并用省略号（...）代替...

文本多余部分用...表示

shbk_的博客

02-01

202

单行文本 white-space: nowrap; /* 文字到边界不换行展示 */ overflow: hidden; /* 溢出边界部分文字隐藏 */ text-overflow: ellipsis; /* 溢出部分用...展示 */ 多行文本 PC端不好实现，大多都是直接文档末尾自己写的... 然后overflow：hidden； ...

参与评论您还未登录，请先登录后发表或查看评论

字符串过长CSS截取多余文字并用省略号显示

09-25

在本篇文章中，我们将探讨如何使用CSS来截取多余的文字并显示省略号。首先，关键的CSS属性有三个：`text-overflow`, `white-space` 和 `overflow`。 1. `text-overflow` 属性：这个属性主要用于控制当内容溢出一...

微信小程序实现多行文字超出部分省略号显示功能

10-16

在微信小程序的开发过程中，有时候我们需要对长文本进行合理的展示，特别是在列表中，为了保持界面的整洁和美观，我们可能需要限制文字的显示行数，超出部分则用省略号表示。本文将详细介绍如何在微信小程序中实现这...

Android设置当TextView中的文字超过TextView的容量时用省略号代替

08-31

在某些场景下，我们可能希望限制TextView显示的文字数量，当内容超出TextView的宽度时，用省略号(...)来表示被截断的部分。这通常用于列表项或者标题，以保持界面的整洁和易读性。本文将详细介绍如何在Android中设置...

自编自动省略文字之Text控件

12-25

在产品开发之前由于没有用到elide这一个Text控件属性，原来这一属性可以自动将多余的文字转化为...省略号。虽然没有用到Text自带的elide参数，但还是挺有用的。由于自编了这一控件的实现方法，代码也是不多可以供...

CSS画出三角形的做法

mingangel的博客

10-01

113

在网页中，会有三角形的出现，我们脑海里会有很多想法，如何去实现他们，我来提供一种比较好玩的做法。

如何用JavaScript编写一个简单的计数器

Jiaberrr的博客

10-01

201

在网页开发中，计数器是一种常见的功能，它可以帮助我们记录点击次数、显示时间等。下面我将介绍如何在HTML页面中使用JavaScript实现一个基本的计数器。

【H2O2|全栈】关于CSS（7）CSS基础（六）

过期的H2O2的博客

09-26

1438

本系列博客将分享层叠样式表（CSS）有关的知识点。本期主要分享元素显示隐藏、透明度、溢出属性、滚动条、居中布局以及网页的部分结构的编写方法。不是专业的科普博主，主打一个分享知识，写的不好，多多包涵（嘿嘿）。

CSS 的pointer-events属性，控制元素如何响应用户指针事件

读心悦

09-25

724

CSS中的属性是一个用于控制元素如何响应用户指针事件（如鼠标点击、触摸等）的重要属性。这个属性可以应用于任何HTML元素，以决定元素是否能够捕获和响应用户的交互事件。以下是关于。

23 vue3之详解scoped&样式穿透&vuecss新特性

qq_37550440的博客

09-27

101

PostCSS会给一个组件中的所有dom添加了一个独一无二的动态属性data-v-xxxx，然后，给CSS选择器额外添加一个对应的属性选择器来选择该组件中dom，这种做法使得样式只作用于含有该属性的dom——组件内部dom, 从而达到了'样式模块化'的效果.vue中的scoped 通过在DOM结构以及css样式上加唯一不重复的标记:data-v-hash的方式，以保证唯一（而这个工作是由过PostCSS转译实现的），达到样式私有化模块化的目的。Vue 提供了样式穿透:deep() 他的作用就是用来改变。

React【vite使用模块化css】

qq_32019935的博客

09-27

533

一般编写组件样式的时候我们都需要做对样式的模块化，以防止组件样式间的样式污染。在vue中有hash限制选择器在react中有样式模块化。

css的背景background属性

Citrus的博客

09-28

1070

background 是一个复合属性，它允许你一次性设置多个与背景相关的样式。background属性还可以设置不同的子属性。

CSS网格布局

weixin_74261199的博客

09-26

1260

希望元素按照网格的方式进行布局，最简单的方式就是利用网格布局。

CSS文本格式化

2401_82561004的博客

09-26

1281

需要特别注意的是，如果元素中的文本不足一行时，是无法实现两端对齐的（默认会以左对齐的效果显示）。属性用来控制文本中英文字母的大小写，通过该属性您可以在不修改原文的基础上，将文本中的英文统一更改为小写字母、大写字母或者首字母大写的形式。当然了，使用 text-decoration 属性也可以在需要的地方为元素中的文本添加一些装饰，达到突出显示的效果。text-decoration 属性用于设置或删除文本的装饰，最常用的做法就是使用 text-decoration 属性来删除。

CSS点击事件穿透

weixin_74261199的博客

09-27

325

假设盒子中有一个按钮，要实现。

CSS列表

2401_82561004的博客

09-28

1101

在网页中很多地方都会用到列表，例如导航菜单、新闻列表、商品分类等等。您除了可以使用 HTML 中的一些属性来对列表进行简单的设置外，在 CSS。

CSS中字体图标的使用