方法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. C++复习15.指针知识

      C++复习15.指针知识 4.指针知识      在Tencent 笔试和面试中都考到了 C/C++中的指针知识,因为自己很不喜欢使用指针,所以才开始学习 Java的,但是现在看来还是躲不掉的,所 ...

  2. iOS如何直接跳转到App Store

    在iOS应用中如何直接跳转到AppStore里面?其实这个问题很简单,首先拿到你要跳转到的AppStore地址(URL) 例如:https://itunes.apple.com/us/app/中久便利 ...

  3. LeetCode之Longest Substring Without Repeating Characters

    [题目描述] Given a string, find the length of the longest substring without repeating characters. Exampl ...

  4. 获取url的hash值

    location是javascript里边管理地址栏的内置对象,比如location.href就管理页面的url,用location.href=url就可以直接将页面重定向url. 而location ...

  5. MySQL在本机无法基于localhost访问的问题解决

    引言: 在本地访问数据库之时,一般使用localhost, 127.0.0.1来进行数据库访问,但是笔者这几天就碰到了只能通过127.0.0.1来访问,但是无法基于localhost来访问,非常之诡异 ...

  6. HDU 2268

    http://acm.hdu.edu.cn/showproblem.php?pid=2268 小学四年级应用题,让我找回了儿时的快乐... #include <iostream> #inc ...

  7. PHP简单实例

    <?php /** * @author admin * @copyright 2016 *编程实现2+4+6+…+100. * $sum = 0; for($i=2;$i<=100;$i+ ...

  8. 如何将局域网中的 windows 硬盘挂载到 linux 系统中

    1.共享windows上的E盘 2.linux上执行 mount //192.168.3.181/e /tmp/test -o username=dell,,password=abcdef 3.保证两 ...

  9. 【Python】Python点滴(一)——pip工具使用

    首先我们来看一条命令:pip install uwsgi 这条命令按照操作名称,可以分为三个部分:pip.install和uwsgi.接下来,按照这样三个部分进行分析.   pip pip类似于Rea ...

  10. 每天一个linux命令(性能、优化):【转载】free命令

    free命令可以显示Linux系统中空闲的.已用的物理内存及swap内存,及被内核使用的buffer.在Linux系统监控的工具中,free命令是最经常使用的命令之一. 1.命令格式: free [参 ...