css实现文本超出部分省略号显示
一般超出文本显示分为两种:单行超出文本和多行超出文本省略号显示,实现方式使用纯css实现:
div { // 单行
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
div { // 多行
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box; // 注意不是flex
-webkit-line-clamp:; // 指定行数
-webkit-box-orient: vertical; // box元素排列水平方式
}
css实现文本超出部分省略号显示的更多相关文章
- CSS控制文本超出指定宽度显示省略号和文本不换行
一般的文字截断(适用于内联与块): .text-overflow { display:block;/*内联对象需加 */ width:31em;/* 何问起 hovertree.com */ word ...
- 【css】 文本超出2行显示省略号
首先,要知道css的三条属性. overflow:hidden; //超出的文本隐藏 text-overflow:ellipsis; //溢出用省略号显示 white-space:nowrap; // ...
- css中文本超出部分省略号代替
p{ width: 100px; //设置p标签宽度 white-space: nowrap; //文本超出P标签宽度不换行,而是溢出 overflow: hidden; //文本超出P标签,超出部分 ...
- CSS控制文本超出指定宽度后用省略号代替,CSS控制文本不换行
CSS控制文本超出指定宽度后用省略号代替,CSS控制文本不换行. 一般的文字截断(适用于内联与块): .text-overflow { display:block;/*内联对象需加*/ ...
- 不值一提,却又不得不提的“CSS文本超出部分省略号代替”
偶然看到一篇类似css技巧与经验总结的文章,其中有一部分非常熟悉,那就是“css控制元素内文本超出部分使用省略号代替”,一般实际工作中, 很多产品经理会对页面UI有这样的要求.还记得,第一次做这个功能 ...
- CSS强制文本在一行内显示若有多余字符则使用省略号表示
这篇文章主要介绍了强制文本在一行内显示,多余字符使用省略号,设置或检索是否使用一个省略标记(...)标示对象内文本的溢出.对应的脚本特性为textOverflow 设置或检索是否使用一个省略标记(.. ...
- CSS控制文本在一行内显示,若有多余字符则使用省略号表示
强制文本在一行内显示,多余字符使用省略号 text-overflow: ellipsis; overflow: hidden; white-space: nowrap;
- CSS实现文本超过指定长度显示省略号
<style type="text/css"> li { width:200px;/*宽度,超过即会溢出*/ line-height:25px;/*设置行间距*/ te ...
- CSS文本单行或者多行超出区域省略号(...)显示方法
单行超出时,主要用到几个CSS属性: 1.text-overflow : clip | ellipsis ; clip : 不显示省略标记(...),而是简单的裁切ellipsis : 当对象内文本溢 ...
随机推荐
- ADV7482&TP2825开发之总结
ADV7482&TP2825开发之总结 这一两个月在项目里接触到了两个视频解码芯片,主要是使用了两颗芯片的CVBS(NTSC)解码功能.外接CVBS Video接入解码芯片,芯片8位并行输出端 ...
- Centos6.5修改镜像为国内的阿里云源
第一步:备份你的原镜像文件,以免出错后可以恢复. mv /etc/yum.repos.d/CentOS-Base.repo /etc/yum.repos.d/CentOS-Base.repo.back ...
- s21day06 python笔记
s21day06 python笔记 一.昨日内容回顾及补充 回顾 补充 列表独有功能 reverse:反转 v = [1,2,3,4,5] v.reverse() #[5,4,3,2,1] sort: ...
- python写service时全局变量问题
在尝试用flask写service的过程中,我发现全局变量使用虽然很方便,但其实是很冒险的. 本次我使用的是声明global变量的方式,如果作为本地的单次使用的程序来说,确实没有问题并且很好用,对于竞 ...
- windows tensorboard http://0.0.0.0:6006 无法访问 解决方法 - using chrome and localhost as ip
启动命令: tensorboard --logdir="tensorboard" 启动后显示 Starting TensorBoard b'47' at http://0.0.0. ...
- 关于windows下的文件结束符
在<c++ primer>中有说,在windows中文件结束符为:ctrl+z,在Linux中为:ctrl+D. 但是在while(cin>>s)的语句运行中,需要两次的^Z, ...
- 算法图解 (Aditya Bhargava 著)
第1章 算法简介第2章 选择排序第3章 递归第4章 快速排序第5章 散列表第6章 广度优先搜索第7章 狄克斯特拉算法第8章 贪婪算法第9章 动态规划第10章 K最近邻算法第11章 接下来如何做 第1章 ...
- .Net Core 项目在Windows服务中托管【转载】
本文以创建的WebAPI项目为例子进行讲解(本人使用VS Code创建的项目) 1.使用VS Code创建WebAPI项目(项目名称自定义) 2.在创建的项目csproj项目文件中,确认是否存在运行时 ...
- 第三章 jQuery总结 参考文本
jQuery jQuery是javascript的一个函数库,非常方便,非常主流 利用jQuery开发步骤: 1导入jQuery库 2在$(function(){})的{}中编写jQuery代码 ①j ...
- xpython在Windos下的安装及简单的文本打开、保存
前几天写自动化部署脚本,用的是paramiko和shell相结合,paramiko可是实现ssh登录,文件及文件夹的上传下载,这些功能,然后一直想自己写个东西出来,于是就想把这些功能我把他放到图形化界 ...