样式：

{width: 160px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap;}

说明：

white-space: nowrap 保证文本内容不会自动换行，如果多余的内容会在水平方向撑破单元格。

overflow: hidden 隐藏超出单元格的部分。

text-overflow: ellipsis 将被隐藏的那部分用省略号代替。

css实现省略号的更多相关文章

  1. css 实现省略号. text-overflow: ellipsis; 同时设置四个属性才可以.

    这个同时需要. text-overflow  ;  overflow  ;  white-space ; width ;  四个属性才可以. <!DOCTYPE html> <htm ...

  2. 纯css实现省略号，兼容火狐，IE9，chrome

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. css文本省略号

    这里记录下如何用CSS实现单行.多行文本溢出容器的时候用省略号代替溢出部分. 单行文本溢出容器时显示省略号的CSS实现方法 /* 规定当内容溢出元素框(容器)时隐藏 */ overflow: hidd ...

  4. css 文本省略号设置

    本文推荐2种方法. 1. css tip:只兼容chrome内核的浏览器.ff不支持. .box { overflow: hidden; /* 溢出时不显示溢出的内容 */ text-overflow ...

  5. css自动省略号...，通过css实现单行、多行文本溢出显示省略号

    网页开发过程中经常会遇到需要把多行文字溢出显示省略号,这篇文章将总结通过多种方法实现文本末尾省略号显示. 一.单行文本溢出显示省略号(…) 省略号在ie中可以使用text-overflow:ellip ...

  6. CSS超出省略号样式

    overflow:hidden;text-overflow:ellipsis;-wekit-line-clamp:3;display:-webkit-box;-webkit-box-orient:ve ...

  7. css 文本省略号显示

    文本省略号是非常常见的需求,而省略号展示又通常分为俩种情况折行和不折行.不折行: div { white-space:nowrap;/* 规定文本是否折行 */ overflow: hidden;/* ...

  8. css显示省略号

    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;  <!-- 就这三句,,,嘿嘿....->

  9. css省略号布局实例截图

    过多文字li标签出现使用css省略号样式截图 使用text-overflow样式让显示不完内容通过css实现省略号排版

随机推荐

  1. iOS 图片加载导致内存警告

    虽然UITableView和UICollectionView都有cell复用机制,但是如果利用SDWebImage加载的图片本身过大且cell复用池中的个数比较多(cell的Size越小,复用池中的c ...

  2. NSJSONSerialization

    /*     总结:   json格式的读写: 解析: data =   NSData  dataWithContentsOfUrl:XXX id obj  =  [ NSJsonSerializat ...

  3. sdk的目录结构及其功能

    sdk的目录结构及其功能 add-ons: 这里面保存着附加库,比如GoogleMaps,当然你如果安装OphoneSDK,这里也会有一些类库在里面. build-tools: 各个版本的sdk编译工 ...

  4. Cookie/Session机制

    这些都是基础知识,不过有必要做深入了解.先简单介绍一下. 二者的定义: 当你在浏览网站的时候,WEB 服务器会先送一小小资料放在你的计算机上,Cookie 会帮你在网站上所打的文字或是一些选择, 都纪 ...

  5. WPF学习之路（七）应用程序和窗口

    手动创建应用程序 1.创建Empty Project 2.添加引用 3.添加 ManualApp.cs 并添加下面的代码 [STAThread] public static void Main() { ...

  6. git入门学习(二)：新建分支/上传代码/删除分支

    一.git新建分支,上传代码到新的不同分支  我要实现的效果,即是多个内容的平行分支:这样做的主要目的是方便统一管理属于同一个内容的不同的项目,互不干扰.如图所示: 前提是我的github上已经有we ...

  7. 数据库 SQL语句小结（更新中）

    ################ Navicat,单条执行sql ################ Navicat,数据库管理工具, 在查询的页面有好多命令,若单条执行: 1:可选中要执行的一条sql ...

  8. [20130919]出现有持续性的Lazy Write

    表现:收到性能告警,LazyWrite严重超标,一般在100以上,正常情况下,LazyWrite为0,但是奇怪的是,当时的Free pages =312190左右,相当于2G空闲空间.OS的可用内存在 ...

  9. GlassFish: 001 安装、启动

    安装 在GlassFish项目的首页就可以找到如何安装: https://glassfish.java.net/download.html#gfoseTab 上面给出了5个步骤:0,1,2,3,4 第 ...

  10. js 求时间差

    var date1=new Date();  //开始时间 var date2=new Date();    //结束时间 var date3=date2.getTime()-date1.getTim ...