width: 100%;//需要指定宽度
 overflow: hidden;//溢出隐藏
 text-overflow: ellipsis;
 white-space: nowrap;//强制不换行

text-overflow: ellipsis;

这里的重点样式是  text-overflow: ellipsis;·

不过话说text-ellipsis是一个特殊的样式,有关解释是这样的:text-overflow属性仅是注解,当文本溢出时是否显示省略标记。并不具备其它的样式属性定义。要实现溢出时产生省略号的效果还须定义:强制文本在一行内显示(white-space:nowrap)及溢出内容为隐藏(overflow:hidden),只有这样才能实现溢出文本显示省略号的效果。

这里面需要限定宽度、文字显示在一行中(white-space:nowrap;)和使用隐藏属性overflow。

css强制不换行 多出的字省略号的更多相关文章

  1. css 强制不换行

    强制不换行 div{white-space:nowrap;} 自动换行 div{ word-wrap: break-word; word-break: normal; } 强制英文单词断行 div{w ...

  2. CSS强制中英文换行与不换行

    1. word-break:break-all; 只对英文起作用,以字母作为换行依据 2. word-wrap:break-word; 只对英文起作用,以单词作为换行依据 3. white-space ...

  3. CSS强制英文换行

    1. word-break:break-all;只对英文起作用,以字母作为换行依据 2. word-wrap:break-word; 只对英文起作用,以单词作为换行依据 3. white-space: ...

  4. [js]纯css强制不换行

    要加在li上 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...

  5. CSS自己主动换行、强制不换行、强制断行、超出显示省略号

    P标签是默认是自己主动换行的,因此设置好宽度之后,可以较好的实现效果,可是近期的项目中发现,使用ajax载入数据之后.p标签内的内容没有换行,导致布局错乱,于是尝试着使用换行样式,尽管攻克了问题.可是 ...

  6. CSS自动换行、强制不换行、强制断行、超出显示省略号

    转自:https://blog.csdn.net/liuyan19891230/article/details/50969393 P标签是默认是自动换行的,因此设置好宽度之后,能够较好的实现效果,但是 ...

  7. css实现强制不换行/自动换行/强制换行

    在我们日常的编码中经常会遇到这段文字不可以换行,或者自动换行的需求.虽然这个功能在我们平时很常见但是我相信大家一定不会可以的去记住它吧(至少小月是很懒惰的从来是用什么查什么 ♦ 嘻嘻...).今天我们 ...

  8. CSS - 如何实现强制不换行、自动换行、强制换行 以及 chrom默认焦点 IE下 Input 默认出现叉

    *:focus {outline: none;} input::-ms-clear {display:none;} 一般的文字截断(适用于内联与块): .text-overflow { display ...

  9. css 强制换行

    强制不换行 div{white-space:nowrap;} 自动换行div{ word-wrap: break-word; word-break: normal; } 强制英文单词断行div{wor ...

随机推荐

  1. js18--继承方式

    方式1:子类.prototype = 父类对象 Boy.prototype = new Person(); Sub.prototype = new Sup('张三');   //可以传参数也可以不传 ...

  2. 腾讯2016实习生面试经验(已经拿到offer)

      忐忑了好几天,今天最终收到深圳总部的电话.允许录用我为2016年实习生,感觉整个天空都放晴了.坐标:武汉大学,给大家说说我的面试经历吧,我投的是软件开发--应用开发方向. 一.校招流程 投递简历- ...

  3. java位运算应用

    位移动运算符: <<表示左移, 左移一位表示原来的值乘2. 比如:3 <<2(3为int型)  1)把3转换为二进制数字0000 0000 0000 0000 0000 000 ...

  4. 几个经常使用的cmd命令

    compmgmt.msc 计算机管理  devmgmt.msc 设备管理器  diskmgmt.msc 磁盘管理工具  dfrg.msc 磁盘碎片整理  eventvwr.msc 事件查看器  fsm ...

  5. Android 通过SOCKET下载文件的方法

    本文实例讲述了Android通过SOCKET下载文件的方法.分享给大家供大家参考,具体如下: 服务端代码 import java.io.BufferedInputStream; import java ...

  6. Quick Sort Algorithm

    快速排序算法实现代码: //============================================================================ // Name : ...

  7. (错误记录)Vue: Unknown custom element

    错误: vue.js:634 [Vue warn]: Unknown custom element: <ve-pie> - did you register the component c ...

  8. Docker 部署Dotnet Core MVC项目

    原文:Docker 部署Dotnet Core MVC项目 1.dotnet core创建项目 dotnet new mvc -o myweb cd myweb 然后就是业务代码的编辑,增删改查乱七八 ...

  9. PatentTips - Method for guest operating system integrity validation

    BACKGROUND The embodiments relate to guest operating system integrity validation, and more particula ...

  10. CSS笔记 - fgm练习 2-8 - 简易日历

    <style> *{margin: 0; padding: 0} .outer{ width: 240px; margin: 10px auto; background: #f0f0f0; ...