CSS 文字超出范围用省略号表示
1. 单行固定宽度,文字超出部分用省略号代替。
.box-text{/* 下方四项配合使用,超出范围的显示... */width: 400rpx;overflow: hidden; /*隐藏*/white-space: nowrap; /*不换行*/text-overflow: ellipsis; /* 超出部分省略号 */
}
2. 多行固定宽高,文字超出部分,隐藏并显示省略号。
.box_text{padding: 30upx;colof: #999;background: #E1FFFF;max-height: 130upx;overflow: hidden;text-overflow: ellipsis; /* 超出部分省略号 */word-break: break-all; /* break-all(允许在单词内换行。) */ display: -webkit-box; /** 对象作为伸缩盒子模型显示 **/-webkit-box-orient: vertical; /** 设置或检索伸缩盒对象的子元素的排列方式 **/-webkit-line-clamp: 3; /** 显示的行数 **/}
CSS 文字超出范围用省略号表示相关推荐
- css 文字超出三行展示省略号
文字超出三行显示省略号: <style type="text/css">div{width: 100px;overflow: hidden;text-overflow: ...
- CSS文字超出部分用省略号代替,js鼠标悬停时显示全部文本
需求: 宽度为百分比,随浏览器变化而变化,当窗口变小到一定程度,文字超出部分用省略号代替,当文字出现省略号,需要鼠标悬停时显示全部文本. 文字超出部分用省略号代替 width:overflow: hi ...
- CSS文字超出部分显示省略号
一行内超出显示省略号 overflow:hidden; /*超出的部分隐藏起来*/ text-overflow:ellipsis;/*超出文本以省略号 */ white-space:nowrap;/* ...
- css 文字超出部分显示省略号
设置table固定布局,否则自适应布局会不受控制 table{table-layout: fixed;} 单行文字 : overflow: hidden; text-overflow:ellipsis ...
- css 文字超出隐藏显示省略号
单行文本 overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
- CSS文字超出部分省略号显示
文章目录[隐藏] CSS 文字超出部分省略号显示前言 CSS 文字超出部分省略号显示实现方法 CSS 文字超出部分省略号显示实现效果 CSS 文字超出部分省略号显示前言 在我们开发过程中,其实有这样的 ...
- 关于用css实现的文字超出部分显示省略号
文字超出部分显示省略号还是比较常用的一个效果,最近看到网上的一些方法亲自实践了一下,发现有些以前一些浏览器不能用的属性现在可以用了,于是研究了一番,现总结如下: 我们先来看下HTML代码: <d ...
- 【CSS】css文字超出显示省略号/文字超过三行显示省略号..
单行 .p1{/*单行*/white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} 多行 .p2{/*多行*/overflow: hidd ...
- css文字超出省略号代替不起作用解决方法汇总大全
先贴一个文字超出后显示省略号的css样式: 单行文字超出显示省略号: .cont{overflow:hidden;/*内容超出后隐藏*/text-overflow:ellipsis;/*超出内容显示为 ...
最新文章
- luogu P2596 [ZJOI2006]书架(平衡树、无旋treap(按排名分裂)一些更复杂的操作)
- JBoss EAP应用获取运行模式、相关路径及节点信息
- oracle构造过程实例
- [Jarvis OJ - PWN]——[XMAN]level2(x64)
- 影视感悟专题---1、B站-魔兽世界代理及其它乱七八糟
- mysql表缓冲大小可能设置过小_MySQL 5.7 my.cnf配置文件详解
- 全国教学交流研讨会“教学为本”主题总结
- ruby on rails_如何在Ruby on Rails应用中用Vue.js替换jQuery
- “天问一号”成功发射,马斯克点赞:非常振奋人心
- python棋盘覆盖问题_棋盘覆盖问题可视化动图——python
- python分词训练_python练习17:用jieba分词做关键词提取,用matplotlib做可视化
- Keil μVision4软件简介
- 马哥linux视频笔记,马哥linux学习笔记(示例代码)
- 学计算机的学数学建模课吗,为什么数学建模与数学实验会进入大学课堂
- MQ消息队列简单介绍+代码
- python生成excel文件报扩展名错误_在python中打开扩展名为.xls的文本文件时出错
- 陶哲轩实分析 习题6.6.5
- centos中startup.sh启动服务脚本
- 用计算机的拓展活动总结,计算机学院心理健康节素质拓展活动圆满结束
- sweet-alert的swal()出现瞬间自动消失(type:“success”类型)