——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样式的更多相关文章

  1. 单行文字溢出和多行文字溢出省略号显示的CSS样式

    单行文字溢出,CSS样式 <h6 style="width:70px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis ...

  2. css 样式控制文本过长实现省略号

    css 样式控制文本过长实现省略号 .topicTitle{ text-overflow: ellipsis; max-width: 75%; overflow: hidden; white-spac ...

  3. 实现文本在标签内平均分布的css样式

    这里有一个容器,添加了一段文字,想让它们平均分布达到标签flex布局的效果,而不是靠左.靠右或者居中显示. 添加样式: text-align: justify; text-align-last: ju ...

  4. 【css】文本超出行数以省略号显示

    //超出2行省略overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webk ...

  5. 【我的Android进阶之旅】Android Studio查看Logcat时,如果一行Log太长如何换行显示?

    使用Android Studio一段时间了,还有很多小技巧没有掌握.今天又发现了一个比较好用的小技巧,这里分享出来. 1.Android Studio默认显示效果 比如我们用Logcat来查看打印的L ...

  6. HTML中超出文本使用省略号替代的CSS样式

    a{ display: block; /*定义显示形式*/ overflow: hidden; /*截取超出字符*/ text-overflow: ellipsis; /*超出字符以…代替*/ whi ...

  7. 百度echarts使用--y轴label数字太长难以全部显示

    问题: 今天遇到个小问题,我们系统前端呈现使用了百度echarts.在绘制折线图的时候,因为数字过大,导致显示出现了问题. 解决方案: 左边y轴的值默认是根据我们填充进去的值来默认分割的,因为原始值就 ...

  8. framework7中一行的字如果过多就省略号显示的CSS写法

    .order-info-title { text-overflow: ellipsis !important; white-space: nowrap !important; overflow: hi ...

  9. Highcharts X轴名称太长,如何设置下面这种样式

      Highcharts所有的图表除了饼图都有X轴和Y轴,默认情况下,x轴显示在图表的底部,y轴显示在左侧(多个y轴时可以是显示在左右两侧),通过chart.inverted = true 可以让x, ...

随机推荐

  1. Largest Rectangle in a Histogram(hdu1506,单调栈裸题)

    Largest Rectangle in a Histogram Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 ...

  2. <寒假逆向学习第一天> 破解基础知识之介绍常见工具和壳的特征

    对于我们新手来说,程序是什么语言编写的?程序到底有没有加壳?程序加了什么壳?一直在我们心中充满了疑惑,本文我将根据我的近期学习,总结一下常见的工具和壳的特征. 一:程序是什么语言编译的 从目前接触到程 ...

  3. 关于python的GIL

    转自依云在知乎上的回答,链接为https://www.zhihu.com/question/27245271/answer/462975593 侵删. python的多线程,其实不是真的多线程,它会通 ...

  4. python核心编程2 第十四章 练习

    14-3.执行环境.创建运行其他Python脚本的脚本. if __name__ == '__main__': with open('test.py') as f: exec(f.read()) 14 ...

  5. JS数组&对象遍历

    遍历的总结,经常用到的,希望帮助你我成长. JS数组遍历: 1,普通for循环 var arr = [1,2,3,4,9]; for ( var i = 0; i <arr.length; i+ ...

  6. python 摘要算法

    一.概述: 摘要算法主要特征是加密过程不需要密钥,并且加密的数据无法解密,只有输入相同的明文数据经过相同的摘要算法才能得到相同的密文.摘要算法主要应用在“数字签名”领域.接下来会讲述RSA公司的MD5 ...

  7. node、npm安装教程

    描述: Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境.Node.js 使用了一个事件驱动.非阻塞式 I/O 的模型,使其轻量又高效. Node.js 的使用包 ...

  8. Java学习笔记二:Java开发工具Eclipse的安装与使用

    Java开发工具Eclipse的安装与使用 正如office一样我们在开发java语言过程中同样需要依款不错的开发工具,目前市场上的IDE很多,这里只演示Eclipse的安装: 一:下载软件: 1.下 ...

  9. List集合中的对象比较,取出不同对象

    今天在做金碟系统与我们系统的对接的时候需要做一个客户同步 在同步时,需要比较对象,对查询出的数据库的数据进行比较 for(int i=0;i<list2.size();i++){ if(! li ...

  10. 在WPF中自定义控件(3) CustomControl (上)

    原文:在WPF中自定义控件(3) CustomControl (上) 在WPF中自定义控件(3) CustomControl (上)                              周银辉 ...