——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. Java解决跨域问题

    同源 URL由协议, 域名, 端口组成. 如果两个URL的协议, 域名, 端口相同, 那么这两个URL为同源. 同源策略 script, iframe, link 可以跨域加载一些静态资源, 比如脚本 ...

  2. IPC进程间通信---信号量

    信号量 信号量:信号量是一个计数器,常用于处理进程或线程的同步问题,特别是对于临界资源访问的同步.临界资源可以 理解为在某一时刻只能由一个进程或线程操作的资源,这里的资源可以是一段代码.一个变量或某种 ...

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

    10-6.改进的open().为内建的open()函数创建一个封装.使得成功打开文件后,返回文件句柄:若打开失败则返回给调用者None, 而不是生成一个异常.这样你打开文件就不需要额外的异常处理语句. ...

  4. JS高度融合入门笔记(二)

    <!DOCTYPE html><html><head> <meta charset="utf-8"> <title>JS ...

  5. Linux : centOS 与 Ubuntu 安装 Nginx

    源码下载: wget http://nginx.org/download/nginx-1.14.0.tar.gz 解压:tar –zxvf xxx 安装依赖: yum -y install  open ...

  6. aioysql(异步操作MySQL)-python

    python异步IO初探 探索异步IO执之前,先说说IO的种类 阻塞IO最简单,即读写数据时,需要等待操作完成,才能继续执行.进阶的做法就是用多线程来处理需要IO的部分,缺点是开销会有些大. 非阻塞I ...

  7. python网络编程的坑（持续更新）

    初学python,踩了许多坑...每天都学一点吧..(大佬绕过) 1.session的用法: session是python requests库中的一个重要功能.session可以存储用户的数据并且存储 ...

  8. C语言：类型、运算符、表达式

    看了一天书,有点累了.就写写随笔记录一下今天的复习成果吧. C语言的基本数据类型 数值型:整型数,浮点数,布尔数,复数和虚数. 非数值型:字符. 整数最基本的是int,由此引出许多变式诸如有符号整数s ...

  9. redhat6.5安装oracle 11g

    1.修改操作系统核心参数 在Root用户下执行以下步骤: 1)修改用户的SHELL的限制,修改/etc/security/limits.conf文件 输入命令:vi /etc/security/lim ...

  10. Python3爬虫（十） 数据存储之非关系型数据库MongoDB

    Infi-chu: http://www.cnblogs.com/Infi-chu/ 一.非关系型数据库NoSQL全程是Not Only SQL,非关系型数据库.NoSQL是基于键值对的,不需要经过S ...