方法1.多行控制(css3)

.text {
width: 100%;
word-break: break-all;
display: -webkit-box;
-webkit-line-clamp:;
-webkit-box-orient: vertical;
overflow: hidden;
}

line-clamp:几行以后显示省略号(例子为2行)

方法2.单行定宽

.text-ellipsis {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}

应用在block级的元素上

连续字符换行问题

p{
word-break:break-all;
word-wrap:break-word;
}

【CSS】文字超出显示省略号&连续字符换行的更多相关文章

  1. css文字超出显示省略号

    单号: white-space:nowrap; overflow:hidden; text-overflow:ellipsis; 多行: word-break: break-all; text-ove ...

  2. CSS文字过多显示省略号

    CSS文字过多显示省略号 /*-webkit-line-clamp用来限制在一个块元素显示的文本的行数*/ .dot1{ width: 100%; display: -webkit-box; -web ...

  3. css文字溢出显示省略号

    1.单行文字溢出显示省略号. overflow: hidden; text-overflow: ellipsis; white-space: nowrap;//文本不换行 2.多行文本溢出显示省略号. ...

  4. css内容超出显示省略号

    CSS实现单行.溢出显示省略号(…) 把要设置的显示省略号的标签,加上以下的属性 overflow: hidden; /*超出不显示*/ text-overflow: ellipsis;/* 超出内容 ...

  5. 用户界面样式(cursor,resize,vertical-align,outline,文字超出显示省略号)

    1. 鼠标样式 cursor default: 小白(箭头)默认 pointer:小手 move:移动 text:文本 not-allowed:禁止 2. 轮廓线(表单外发光)outline 给表单添 ...

  6. CSS解决文字超出显示省略号问题

    超出一行 white-space: nowrap; overflow: hidden; text-overflow: ellipsis; 超出多行 overflow: hidden; text-ove ...

  7. table表格中文字超出显示省略号

    第一步: table {table-layout:fixed:}列宽由表格宽度和列宽度设定,不随文字多少变化 第二步: td { white-space:nowrap;/*文本不会换行,文本会在在同一 ...

  8. table td 文字超出显示省略号

    .autocut {      width:250px;      overflow:hidden;      white-space:nowrap;      text-overflow:ellip ...

  9. css文字超出变省略号...

    <style>.text1 {    width:200px;    overflow:hidden;    text-overflow:ellipsis;    -o-text-over ...

随机推荐

  1. Spring整合Hibernate:2、使用Annotation方式进行声明式的事务管理

    1.加入DataSourceTransactionManager的命名空间 修改applicationContext.xml文件,增加如下内容: 1 2 3 4 5 6 7 8 9 10 11 12 ...

  2. iOS开发探索-高斯模糊&毛玻璃效果

    iOS开发中有的时候需要将图片设置模糊,来实现特定的效果获取更好的用户体验, iOS7之后半透明模糊效果得到大范围使用的比较大,现在也可以看到很多应用局部用到了图片模糊效果,可以通过高斯模糊和毛玻璃效 ...

  3. 使用微软T4 template进行代码生成

    使得软件工程高效开发的主要方法是复用.复用的宗旨是提高设计的内聚性,主要包括:函数,类,模式,组件,框架等等.而有些应用场景并都是可以直接拿来现成代码使用的,有时代码库的代码不是那么容易修改,或者根本 ...

  4. Chrome浏览器清除页面js文件缓存的方法

    Chrome浏览器清除页面js文件缓存 Chrome浏览器清除js缓存方法虽然简单,但有些人还是不太会,有些人会去设置里面清除有时候没有用,这里写一下简单步骤,使用一次以后就会了,而且速度更快 1.打 ...

  5. Split功能的思想实现

    using System; using System.Collections; using System.Collections.Generic; using System.Linq; using S ...

  6. 【解题报告】CF Round #320 (Div. 2)

    Raising Bacteria 题意:盒子里面的细菌每天会数量翻倍,你可以在任意一天放任意多的细菌,最后要使得某天盒子里面的细菌数量等于x,求至少要放多少个细菌 思路:显然,翻倍即为二进制左移一位, ...

  7. oracle中查询结果集为空,则得到一个默认值

    有同事问我上述问题,我把我的实现思路写出来.子查询把查询的结果和默认的结果全部显示.父查询通过伪列rownum来筛选,如果查询有结果,就有几条就显示几条,而不去显示子查询中的默认值:如果查询没有结果, ...

  8. SEO中H1标签的用法- 1

    在网上找了很多关于H1标签对SEO意义的资料,不可否认H1对SEO具有重大的意义,但是具体情况每个人有每个人的见解吧.这里主要根据网上搜索的资料,以及自己的一些经验整理出来的,但是本人毕竟不是专业SE ...

  9. LOJ2425 NOIP2015 运输计划 【二分+LCA+树上差分】*

    LOJ2425 NOIP2015 运输计划 LINK 题意:给你一颗树,可以将任意一条边的权值变成0,然后求m条路径的长度的最小值 思路: 先二分最后的距离ans,然后我们把路程大于ans的所有路径拿 ...

  10. 携程框架Apollo实现.NET Core微服务统一配置(测试环境-单机)

    Apollo实现.NET Core微服务统一配置(测试环境-单机) https://www.cnblogs.com/guolianyu/p/10065999.html 一.前言 注:此篇只是为测试环境 ...