p {
width:100px;
position:relative;
line-height:20px; /*行高为高度的一半,这样就是两行*/
height:40px;
overflow:hidden;
}
p:after { /*使用伪元素*/
content:"...";
position:absolute;
bottom:0;
right:0;
background:#FFF; /*这个背景色要和p的背景色一致,也就是做个假^_^*/
padding-left:6px; /*这里自己调一调*/
}

css 控制文字显示两行,多余用省略号 手机端的更多相关文章

  1. CSS控制文字显示一行,超出显示省略号

    这几天在项目需求里面遇到了很多之前没做过的需求,也慢慢更加认识到了css的强大,是真的强大.以后会把自己技术调研的东西都写出来,哪怕只是一点点或者很小的点,重在学习. “CSS控制文字显示一行,超出显 ...

  2. css控制文字显示长度,超过用省略号替代

    .line_text { width:200px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } <span cl ...

  3. css 控制文本显示两行 超过省略号显示

    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; word-break: break-all; ov ...

  4. 使用css控制文字显示几行并且剩余部分隐藏(移动端和PC端同样适用)

    前言 有些需求需要我们控制一段文本最多显示几行,就像逛淘宝京东的评价楼层一样,有时可能还需要隐藏剩余部分,这样的需求我们怎么来解决呢? 解决办法 我们完全可以使用css来解决这一需求 1. 解决文本显 ...

  5. css控制文字长度,超出长度显示...

    css控制文字长度,超出长度显示... .style { max-width: 165px; overflow: hidden; white-space: nowrap; text-overflow: ...

  6. --css 控制文字多使用省略号

    --css 控制文字多使用省略号.overflowPoint{ text-overflow:ellipsis;width: 200px;overflow: hidden;}<div class= ...

  7. css限制文字显示字数长度,超出部分自动用省略号显示,防止溢出到第二行

    为了保证页面的整洁美观,在很多的时候,我们常需要隐藏超出长度的文字.这在列表条目,题目,名称等地方常用到. 效果如下: 未限制显示长度,如果超出了会溢出到第二行里.严重影响用户体验和显示效果. 我们在 ...

  8. 2016/04/13 ①html 中各种分割线------------------------------------------ ② 控制文字显示

    ①各种分割线Html代码 1.<HR> 2.<HR align=center width=300 color=#987cb9 SIZE=1>align 线条位置(可选left. ...

  9. css控制div显示/隐藏方法及2种方法比较原码 - czf164的专栏 - 博客频道 - CSDN.NET

    body{ font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI& ...

随机推荐

  1. 前端面试题整理—jQuery篇

    1.为什么使用jquery,他有哪些好处? 1)轻量级.代码简洁 2)强大的选择器,出色的DOM操作封装 3)有可靠的事件处理机制 4)浏览器兼容性好 5)支持链式操作 6)支持丰富的插件 2.jqu ...

  2. IISExpress使用64位

    C#有一些函数如GetHashCode和x86,X64版本有关系,为了和服务器保持一致,本地iis Express也需要设置64位. 方法如下,vs2010不支持. vs2012可以手动添加配置 re ...

  3. How to learn PDE (怎么学偏微分方程)

    To learn PDE, you need some knowledge of physics (to build up the intuition), solid training of anal ...

  4. [译]Ocelot - Request Id / Correlation Id

    原文 Ocelot可以通过header的形式发送一个requestid.ocelot会将这个requestid转发到下游服务. 如果在日志配置中设置了IncludeScopes为true,那么requ ...

  5. APPLE-SA-2019-3-25-4 Safari 12.1

    APPLE-SA-2019-3-25-4 Safari 12.1 Safari 12.1 is now available and addresses the following: Safari Re ...

  6. Vue技术内幕 出去看看吧 榨干部分小细节

    vue\src\platforms\web\entry-runtime-with-compiler.js /** * Get outerHTML of elements, taking care * ...

  7. ModuleNotFoundError: No module named '_sqlite3' -- python2.7 问题

    ModuleNotFoundError: No module named '_sqlite3' 运行python 工程出现上面这个问题,以为python安装中缺少这个依赖, 注python 2.7 首 ...

  8. Java z 404

    problem: relative 与absolute 绝对和相对定位 为什么缩放页面里会有离开的情况 为什么a链接里与文字无法对齐 这么多代码为什么没有最好 用最简单的代码去执行一个相应的命令 实现 ...

  9. PHP 【二】

    EOF EOF(heredoc)是一种在命令行shell(如sh.csh.ksh.bash.PowerShell和zsh)和程序语言(像Perl.PHP.Python和Ruby)里定义一个字符串的方法 ...

  10. VS2012遇到一个问题:"链接器工具错误 LNK2026 XXX模块对于 SAFESEH 映像是不安全的"

    解决方法: 1.打开该项目的“属性页”对话框. 2.单击“链接器”文件夹. 3.单击“命令行”属性页. 4.将 /SAFESEH:NO 键入“附加选项”框中,然后点击应用.