多行文本溢出处理:

display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3; // 3 行
overflow: hidden;

单行文本溢出处理:

overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;

但如果溢出效果的文本外还有一层 p ,则溢出效果不会显示,如下代码 :

<div>
<p>老师你给是风格顺过饰非色发给</p>
</div>

解决办法是将 p 的 display 设为 inline

css 文本溢出的更多相关文章

  1. CSS 文本溢出时显示省略标记

    如标题所示... <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.o ...

  2. CSS文本溢出显示省略号

    项目中常常有这种需要我们对溢出文本进行"..."显示的操作,单行多行的情况都有(具体几行得看设计师心情了),这篇随笔是我个人对这种情况解决办法的归纳,欢迎各路英雄指教. 单行 语法 ...

  3. css文本溢出隐藏显示省略号(单行+多行)

    文本超出若干行就换行,这个功能几乎每个文本浏览网站都会用到,实现它的办法也有很多,今天简单的介绍一下实现它的方法.  一. 单行文本不换行,并将超出文本隐藏 .box-content{     ove ...

  4. CSS文本溢出处理方式

    1. 单行文本溢出省略号效果 .ellipsis { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; } <div cl ...

  5. CSS ... 文本溢出用省略号代替

    { overflow:hidden; text-overflow:ellipsis; white-space:nowrap } text-overflow 属性规定当文本溢出包含元素时发生的事情. c ...

  6. CSS文本溢出效果&滚动条样式设置

    一.文本溢出 1.overflow: hidden;  超出文本会被剪裁隐藏不可见 scroll;超出文本会被剪裁, 显示滚动条 auto; 如果文本超出会显示滚动条,没超出不会显示, overflo ...

  7. css文本溢出解决方案

    1.普通单行截断省略 overflow:hidden; 文字长度超出限定宽度,则隐藏超出的内容) text-overflow:ellipsis;(设置文字在一行显示,不能换行) white-space ...

  8. #CSS 文本溢出部分显示省略号

    单行结尾溢出: 用text-overflow:ellipsis属性实现,当然还需要加宽度width属来兼容部分浏览. width:300px;overflow: hidden; text-overfl ...

  9. css 文本溢出显示省略号

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

随机推荐

  1. Log4J & elk 事故总结

    周六的早晨8点,应用出现了大面积的登录超时问题. 作为一款日活15W.用户量700W+的应用,这是致命的问题. 唯一的安慰是——好在今天是周末,加班的公司才会使用.虽然如此,客服.产品的电话也被打爆了 ...

  2. 如何解决VMware 虚拟机不能铺满屏幕

    出现这种情况是因为分辨率设置问题,调整分辨率总能达到你想要的效果: 首先设置vmware为全屏模式 查看物理机的分辨率,然后再将虚拟机的分辨率设置了跟物理机的一致.完美解决 windows10查看分辨 ...

  3. Into outfile禁用情况下另类方法拿webshell

    首先环境如下: OS:Windows 2003 WAF:Safe Dog 4.0正式版 phpmyadmin:4.7(许多都可以) Mysql:5.5+ PHP:5.3 Apache:2.x 总结方法 ...

  4. Hadoop HDFS 的 HttpFS

    参考 Hadoop权威指南 第3章中3.4节 背景 要写一个操作HDFS的web后台(文件CRUD),虽然可以直接使用HDFS提供的FileSystem类然后通过get方法获取到一个Distribut ...

  5. js-学习笔记-Thunk函数

    Thunk 函数是自动执行 Generator 函数的一种方法. 编译器的“传名调用”实现,往往是将参数放到一个临时函数之中,再将这个临时函数传入函数体.这个临时函数就叫做 Thunk 函数. fun ...

  6. 高性能JavaScript(DOM编程)

    首先什么是DOM?为什么慢? DOM:文档对象模型,是一个独立于语言的,用于操作XML和HTML文档的程序接口(API) 用脚本进行DOM操作的代价很昂贵.那么,怎样才能提高程序的效率? 1.DOM访 ...

  7. 高性能JavaScript(加载和执行)

    当浏览器遇到 <script> 标签时,它是没办法知道 JavaScript 是否会向DOM中添加内容或引入其他元素,甚至关闭某一个标签.因此这个时候浏览器就会停止处理页面,先执行Java ...

  8. 关于ajax 传递的参数

    ajax 发送的数据,默认都是字符串,不能直接传递list(列表),或者dict(字典). 若要 传递list(列表),或者dict(字典),需要进行一些操作. list 需要进行列表序列化,在aja ...

  9. 网络基础 HTTP协议之缓存简介

    HTTP协议之缓存简介 by:授客 QQ:1033553122 用浏览器查看缓存 IE为例,Tools->Internet options -> View files,如图 点击图示的Vi ...

  10. 域名检索&路由算法

    域名查询顺序: a. 浏览器缓存(本机hosts文件),浏览器会缓存DNS记录一段时间. b. 系统缓存 c. 路由器缓存 d. 检查ISP e. 递归搜索域名服务器 路由算法: 一.静态路由算法 a ...