CSS 文字超长省略显示并隐藏超长部分
1.包含文字的元素必须是块级元素,不是块级元素使用display:block使其具有块级元素属性;
2.具备上述基本条件后,css样式如下:
{
display: block;
max-width: 300px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
如果包含在table的td元素内,td元素需要明确width的百分比,例如:width:20%;
CSS 文字超长省略显示并隐藏超长部分的更多相关文章
- css文字超出自动显示省略号
只针对单行文本有效: 01.针对块状元素 ul li{ width: 180px; text-overflow: ellipsis; white-space: nowrap;/*禁止自动换行*/ ov ...
- CSS 文字溢出时的自动隐藏
http://www.111cn.net/cssdiv/css/34050.htm 语法:overflow : visible | auto | hidden | scroll visible::不剪 ...
- jquery控制css的display属性(显示与隐藏)
jquery控制div的显示与隐藏,很方便的. 例如: $("#id").show()表示display:block, $("#id").hide()表示dis ...
- css 文字超出部分显示省略号(原)
单行超出省略号 #word1{width: 100px; text-overflow: ellipsis; overflow: hidden;} 几行超出省略号(只兼容webkit内核) #wordN ...
- css设置滚动条并显示或隐藏
看效果,没有滚动条,超出div,开发中肯定不行. 有滚动条 最后就是想隐藏滚动条 代码 有滚动条并显示 <!DOCTYPE html> <html lang="en&quo ...
- css中有三个显示和隐藏的单词比较常见,display visibility 和 overflow我们需要区分开来
display display 设置或检索对象是否及如何显示 display: none 隐藏对象与它相反的是display:block 除了转换为块级元素之外,同时还有显示元素的意思 特点: 隐藏之 ...
- css文字超出后显示...
多行 overflow: hidden; //超出的文本隐藏 text-overflow: ellipsis; //溢出用省略号显示 display: -webkit-box; -webkit-lin ...
- js+css+div的点击后显示或者隐藏
<html ><head><meta charset=utf-8 /><title>JS Bin</title></head> ...
- CSS文字超出省略
.ellipsis { white-space:nowrap overflow:hidden text-overflow:ellipsis }
随机推荐
- BZOJ2430 chocolate
有一个显然的想法是因为最后要花分成n*m个小块,所以每条边一定是要被切开的. 所以直接排序就可以了qwq,按照代价从大到小切一定是最优的. #include<iostream> #incl ...
- jvisualvm_使用jmx连接远程linux应用
[前提] JVisualVM是由Sun提供的性能分析工具,在Jdk6.0以后的版本中是自带的,如果是用Jdk1.5或以前版本的就得要单独安装了. [1]远程机器需要开启jmx 在使用jvisualvm ...
- [ActionScript 3.0] 通过BitmapData将对象保存成jpg图片
此方法需要用到JPGEncoder.as和BitString.as这两个类,是将BitmapData对象转换成ByteArray,然后通过FileStream把此ByteArray写入到文件保存成jp ...
- [转] Linux 安装.src.rpm源码包的方法
方法一:以setarch-1.3-1.src.rpm 软件包为例(可以到CSDN http://download.csdn.net/source/215173#acomment下载) 假设该文件已经存 ...
- 2018 noip AFO? 祭
\(\color{#00ffff}{DAY \ \ -1}\) 一下午,都在说注意事项,也没刷题 学姐说,考前远离rqj,会被%,掉rp(雾 晚上8点20,内心有一丝悸动... 于是去找教练谈话 在教 ...
- TortoiseSVN查看修改时报错的解决方法
提交Bug后很快就修复了,给Stefan点个赞.大家等新版本(1.11.1)发布就可以了. -------------------------分割线下是原文---------------------- ...
- Kafka:Consumer
1.预览 1.1 消费者组(Consumer Group) 一个consumer group可能有若干个consumer实例 同一个group里面,topic的每条信息只能被发送到group下的一个c ...
- Pytorch学习笔记(二)——Tensor
一.对Tensor的操作 从接口的角度讲,对Tensor的操作可以分为两类: (1)torch.function (2)tensor.function 比如torch.sum(a, b)实际上和a.s ...
- native excel 文件已经打开的判断
book := TXLSWorkbook.Create; try then begin raise Exception.Create('请检查导入的文件是否存在或Excel已经处于打开状态(如果已经打 ...
- js Object.keys 用法
Object.keys() 可以将对象里的所以的键取出来放到一个数组中 1.传入对象, 返回 包含对象可枚举属性和方法的数组 var obj = {'a': 'Beijing', 'b': 'Ha ...