css让文字显示特定行数,多余的显示省略号
/*css*/
.p{
width: 200px;
word-break: break-all;
text-overflow: ellipsis;
display: -webkit-box; /** 对象作为伸缩盒子模型显示 **/
-webkit-box-orient: vertical; /** 设置或检索伸缩盒对象的子元素的排列方式 **/
-webkit-line-clamp: 2; /** 显示的行数 **/
overflow: hidden; /** 隐藏超出的内容 **/
}
1,word-break:break-all 例如div宽200px,它的内容就会到200px自动换行,如果该行末端有个英文单词很长(congratulation等),它会把单词截断,变成该行末端为conra(congratulation的前端部分),下一行为tulation(conguatulation)的后端部分了。
2,word-wrap:break-word 例子与上面一样,但区别就是它会把congratulation整个单词看成一个整体,如果该行末端宽度不够显示整个单词,它会自动把整个单词放到下一行,而不会把单词截断掉的。
css让文字显示特定行数,多余的显示省略号的更多相关文章
- css文字超出指定行数显示省略号
display: -webkit-box; overflow: hidden; word-break: break-all; /* break-all(允许在单词内换行.) */ text-overf ...
- line-height超出隐藏显示的行数和垂直居中
line-height是css样式里设置行高的方法,在div中有overflow:hidden,可以隐藏超出div的内容,配合行高和div的高,可以设置该div里可以显示几行内容,div可以容纳几个行 ...
- eclipse怎么显示代码行数
熟悉java开发的朋友们肯定有这样的经验,那就是在用eclipse进行java开发的时候,没有显示代码的行数,这并不利于我们进行程序的调试.今天,小编就来教大家eclipse怎么显示代码行数 ...
- 【转】Eclipse Console 加大显示的行数,禁止弹出
转载地址:http://blog.csdn.net/leidengyan/article/details/5686691 Eclipse Console 加大显示的行数: 在 Preferences- ...
- eclipse显示代码行数
最近做的手机APP正在进行最后一部分了,在一个类中估计要写上千行代码,来回的拉动滚动条太麻烦了,于是发现为什么我得eclipse不显示代码行数呢 其他C什么的编译器都显示的. 于是百度了一下,一下子 ...
- css实现单行(多行)文本溢出显示 ...
overflow: hidden; text-overflow:ellipsis; white-space: nowrap; 当然还需要加宽度width属来兼容部分浏览. 以上为单行文本溢出===== ...
- 在Vue中使用CodeMirror 格式显示错误 行数错乱 & 代码隐藏
项目需要在线展示和编辑Json文件,所以需要找一个代码编辑器,因为我们的项目直接使用的 vueAdmin-template 这个模板 json编辑器也是直接从 vue-element-admin 项目 ...
- Grid++Report设置显示固定行数
一.要实现的功能打印的报表显示固定的行数,并且设置字段的文字可以自动换行二.设置步骤1.鼠标左键单击“明细网格”栏,在右侧属性窗口中设置“追加空白行”属性值为:是:“追加空白行在后”属性值为:是.2. ...
- AIO5岗位桌面主页【我的收藏夹】只显示8行,怎样增加显示行?
问题: 为什么主页上的收藏夹只能放8个显示?超出部分显示不出来了?应该怎样操作? 解决方案: 原因分析:桌面区域(系统)内的[我的收藏夹]是固定行高的. 解决方案:通用设置里面去设置[桌面系统模块行数 ...
随机推荐
- Swagger 接口文档
目录 Swagger 介绍 Swagger 依赖 SpringBoot 集成 Swagger 配置类 常用注解 效果示例 Swagger 介绍 Swagger UI 允许任何人(无论是开发团队还是最终 ...
- LGP2414题解
难不成是我后缀自动机学魔怔了,AC 自动机都能套上线段树 题意:给你一颗 Trie,每次询问两个节点 \(u,v\),\(u\) 代表的字符串在 \(v\) 代表的字符串中出现了多少次. 让我们思考一 ...
- H3C三层交换机之IRF虚拟化技术详解及配置
一.IRF是什么? 目前,网络中主要存在两种结构的通信设备,固定盒式设备和模块框式分布式设备. 固定盒式设备成本低廉,但没有高可用性支持:模块框式分布式设备具有高可用性.高性能.高端口密度的优点,但投 ...
- vue3-组件中使用setup函数获取vuex中的数据的新方式
传统方式 setup() { const store = useStore() //传统方式 const aName = computed(() => store.state.name) ret ...
- 分布式session的几种解决方案
现在很多商城,都会要求用户先去登录,登录之后再往购物车中添加商品,这样用户.购物车.商品,三个对象之间就有了绑定关系. 而针对我最开始说的那种情况,其实就是基于session做的,客户端往购物车中添加 ...
- oracle 11g生成ASH报告操作过程
1.ASH (Active SessionHistory) ASH以V$SESSION为基础,每秒采样一次,记录活动会话等待的事件.不活动的会话不会采样,采样工作由新引入的后台进程MMNL来完成. v ...
- Django项目常用的logging配置。
做开发开不开日志,以下是我在工作中写Django项目常用的logging配置. LOGGING = { 'version': 1, 'disable_existing_loggers': False, ...
- 6月13日 python学习总结 Django框架
1. 内容回顾 1. 基础必会三件套 from django.shortcuts import HttpResponse, render, redirect - HttpResponse(" ...
- 6月6日 python学习总结 jQuery (三)
1. 常用事件 1. hover #鼠标悬停监听 2. keydown和keyup #键盘按键 按下/抬起 3. change #监听值的改变 全部输入完失去焦点后 4. focus和blur # 获 ...
- Java的浅克隆和深克隆
如何实现对象的克隆 (1)实现 Cloneable 接口并重写 Object 类中的 clone() 方法: (2)实现 Serializable 接口,通过对象的序列化和反序列化实现克隆,可以实现真 ...