如果是一行的话

css为

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

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

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

若是想要超出指定的行数再显示...

css为

word-break:break-all;
display:-webkit-box;
-webkit-line-clamp:2; //这里写的数字是几就是超过几行剩余的显示省略号
-webkit-box-orient:vertical;
overflow:hidden;

css实现超出部分用...代替的更多相关文章

  1. css把超出的部分显示为省略号的方法兼容火狐

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...

  2. css实现超出一行后用省略号显示

    css实现超出一行后用省略号显示 a{display:inline-block; text-overflow:ellipsis; white-space:nowrap; overflow:hidden ...

  3. css文本超出省略号

    终于完成了项目了,今天我就分享自己在项目中比较实用的一些功能的实现,第一个就是纯css文本超出省略号 /* 文本单行超出省略号 */ .textels { overflow: hidden; text ...

  4. css文字超出自动显示省略号

    只针对单行文本有效: 01.针对块状元素 ul li{ width: 180px; text-overflow: ellipsis; white-space: nowrap;/*禁止自动换行*/ ov ...

  5. css控制超出部分自动省略...

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

  6. css 文字超出部分显示省略号(原)

    单行超出省略号 #word1{width: 100px; text-overflow: ellipsis; overflow: hidden;} 几行超出省略号(只兼容webkit内核) #wordN ...

  7. CSS文字超出div或者span时显示省略号

    我们常常需要在文本过长时显示,将超出显示成省略号: 思想为: 首先设置宽度,然后让超出的部分隐藏如果有超出则在最后显示省略号让文本不换行 具体css代码为: .title{ width:200px;o ...

  8. CSS文本超出2行就隐藏并且显示省略号

    今天做东西,遇到了这个问题,百度后总结得到了这个结果. 首先,要知道css的三条属性. overflow:hidden; //超出的文本隐藏 text-overflow:ellipsis; //溢出用 ...

  9. css文字超出一行用点表示

    1,css超出一行用点表示 white-space:nowrap; overflow:hidden; text-overflow:ellipsis; 2,css超出二行用点表示 overflow:hi ...

随机推荐

  1. linux 下安装eclipse和pydev插件用来开发python程序

    1.网上的教程要求必须要安装java虚拟机,但是我觉得不用,但是为了不出意外就装吧. (1)去官网下载安装包www.sun.com (2)安装包是.tar.gz的可以用 tar -xzvf +压缩包路 ...

  2. android学习16——library project的使用

    library project和普通的project没有区别.用如下命令新建的一个工程. android create project --target 3 --name MyActivity --p ...

  3. 3D Touch开发全面教程之Peek and Pop - 预览和弹出

    ## 3D Touch开发全面教程之Peek and Pop - 预览和弹出 --- ### 了解3D Touch 在iPhone 6s和iPhone 6s Plus中Apple引入了3D Touch ...

  4. 原生js中slice()方法和splice()区别

    slice()方法和splice()方法都是原生js中对数组操作的方法. slice(),返回一个新的数组,该方法可从已有的数组中返回选定的元素.例如:arrObject(start,end),sta ...

  5. 关于JavaScript简单描述

    1.什么是JavaScript? JavaScript 是一种专门用于与网页交互而设计的脚本语言,它有三部分组成,那是哪三部分呢?分别是ECMAScript(提供核心语言功能),DOM(提供访问和操作 ...

  6. ajax bookstrap美化网页，并实现页面的加载，删除与查看详情

    Bookstrap:美化页面: Bootstrap是Twitter推出的一个开源的用于前端开发的工具包.它由Twitter的设计师Mark Otto和Jacob Thornton合作开发,是一个CSS ...

  7. 1610: [Usaco2008 Feb]Line连线游戏

    1610: [Usaco2008 Feb]Line连线游戏 Time Limit: 5 Sec  Memory Limit: 64 MB Submit: 1396  Solved: 615 [Subm ...

  8. image图片拉伸

    p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 18.0px "PingFang SC"; color: #1d9421 } p.p2 ...

  9. C#"曾经的字符串数组"string[] array=new string[]{"**","****"};

    写博客是一件很伟大的事情,尤其是也牛逼的博客,因为它能帮助需要的人,更能使自己对知识有一个更为深刻的理解! 欢迎关注我的博客! 字符串操作(取当前时间) string time=convert.tos ...

  10. java关于map用来筛选的用法

    我有一个实体 PropTemplateItem{id,名称,父节点,模版id},父节点为root是定义为根节点. 例如数据: 001,颜色,root,123 002,白色,001,123 003,红色 ...