文本太长,用省略号显示的css样式
——html代码
<divid="d1" title="鼠标放上显示的文字"></div>
——css代码
#d1{
width:300px;
overflow:hidden;
white-space:nowrap;
text-overflow:ellipsis;
/*兼容性*/
-webkit-text-overflow:ellipsis;
}
注:关键是给容器指定宽度,并且利用white-space:nowrap;属性阻止超出部分自动换行,省略号则是由text-overflow:ellipsis;实现的
文本太长,用省略号显示的css样式的更多相关文章
- 单行文字溢出和多行文字溢出省略号显示的CSS样式
单行文字溢出,CSS样式 <h6 style="width:70px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis ...
- css 样式控制文本过长实现省略号
css 样式控制文本过长实现省略号 .topicTitle{ text-overflow: ellipsis; max-width: 75%; overflow: hidden; white-spac ...
- 实现文本在标签内平均分布的css样式
这里有一个容器,添加了一段文字,想让它们平均分布达到标签flex布局的效果,而不是靠左.靠右或者居中显示. 添加样式: text-align: justify; text-align-last: ju ...
- 【css】文本超出行数以省略号显示
//超出2行省略overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webk ...
- 【我的Android进阶之旅】Android Studio查看Logcat时,如果一行Log太长如何换行显示?
使用Android Studio一段时间了,还有很多小技巧没有掌握.今天又发现了一个比较好用的小技巧,这里分享出来. 1.Android Studio默认显示效果 比如我们用Logcat来查看打印的L ...
- HTML中超出文本使用省略号替代的CSS样式
a{ display: block; /*定义显示形式*/ overflow: hidden; /*截取超出字符*/ text-overflow: ellipsis; /*超出字符以…代替*/ whi ...
- 百度echarts使用--y轴label数字太长难以全部显示
问题: 今天遇到个小问题,我们系统前端呈现使用了百度echarts.在绘制折线图的时候,因为数字过大,导致显示出现了问题. 解决方案: 左边y轴的值默认是根据我们填充进去的值来默认分割的,因为原始值就 ...
- framework7中一行的字如果过多就省略号显示的CSS写法
.order-info-title { text-overflow: ellipsis !important; white-space: nowrap !important; overflow: hi ...
- Highcharts X轴名称太长,如何设置下面这种样式
Highcharts所有的图表除了饼图都有X轴和Y轴,默认情况下,x轴显示在图表的底部,y轴显示在左侧(多个y轴时可以是显示在左右两侧),通过chart.inverted = true 可以让x, ...
随机推荐
- 微信小程序已发布版本vconsole仍出现问题解决办法
解决办法很简单,进入小程序的体验或者开发版,点击关闭调试,再次进入小程序,就不会出现了
- java中的==、equals()源码分析
浅谈Java中的equals和== 在初学Java时,可能会经常碰到下面的代码: 1 String str1 = new String("hello"); 2 String str ...
- VUE插件整理
转自:https://blog.csdn.net/miaozhenzhong/article/details/80138174 1.VsCode官方插件地址: https://marketplace. ...
- LeetCode 中级 - 路径总和2(113)
给定一个二叉树和一个目标和,找到所有从根节点到叶子节点路径总和等于给定目标和的路径. 说明: 叶子节点是指没有子节点的节点. 示例:给定如下二叉树,以及目标和 sum = 22, 5 / \ 4 8 ...
- 【HDOJ 1269】迷宫城堡(tarjan模板题)
Problem Description 为了训练小希的方向感,Gardon建立了一座大城堡,里面有N个房间(N<=10000)和M条通道(M<=100000),每个通道都是单向的,就是说若 ...
- Spring常见面试题
本文是通过收集网上各种面试指南题目及答案然后经过整理归纳而来,仅仅是为了方便以后回顾,无意冒犯各位原创作者. Spring框架 1. 什么是Spring? Spring 是个java企业级应用的开源开 ...
- 数据分析处理库Pandas——时间
时间戳 向后推的时间戳 备注:五天后的时间. 指定日期和时间 时间的Series结构 按要求显示时间(开始时间,时间间隔,时间个数) 转换为时间格式,并设置时间列为索引列 方法一 方法二 筛选显示 方 ...
- hive表格取差集
hive 求两个集合的差集 业务场景是这样的,这里由两个hive表格A和B A的形式大概是这样的:uid B的形式大概是这样的:uid 我想要得到存在A中但是不存在B中的uid 具体代码如下 sele ...
- scrapy框架爬取笔趣阁完整版
继续上一篇,这一次的爬取了小说内容 pipelines.py import csv class ScrapytestPipeline(object): # 爬虫文件中提取数据的方法每yield一次it ...
- 【Python让生活更美好01】os与shutil模块的常用方法总结
Python作为一种解释型的高级语言,脚本语言,又被称作“胶水语言”,就是因为其灵活的语法和其依靠浩如烟海的第三方包实现的丰富多彩的功能,而os和shutil就是这样一种功能强大的模块,可以非常快捷地 ...