1.非多行的简单处理方式:

css代码:

.words{
width:400px;
overflow:hidden; /*超过部分不显示*/
text-overflow:ellipsis; /*超过部分用点点表示*/
white-space:nowrap;/*不换行*/
}

2.规定行数的截断处理方式

css代码:

.words{
  width:400px;
text-overflow: ellipsis; /*有些示例里需要定义该属性,实际可省略*/
display: -webkit-box;
-webkit-line-clamp: 2;/*规定超过两行的部分截断*/
 -webkit-box-orient: vertical;
 overflow : hidden;
word-break: break-all;/*在任何地方换行*/
}

css处理超出文本截断问题的两种情况(多行或者单行)的更多相关文章

  1. JS获取元素宽高的两种情况

    JS获取元素宽高分两种情况, 一.内联样式,也就是直接把width和height写在HTML元素中的style里: 这种情况使用     document.getElementById('xxx'). ...

  2. java项目打jar包的两种情况

    链接地址:http://jingyan.baidu.com/article/6b97984d8a6ddc1ca2b0bfa0.html 本文介绍一下java项目打jar包时的两种情况各怎么操作   方 ...

  3. Day6------------磁盘用满的两种情况

    1.文件包含元数据和写入的内容 元数据:存在硬盘中的inode ls -i /etc/passwd.bak 查看inode df -i 查看inode 2.磁盘用满的两种情况 1).内容太多 2).空 ...

  4. Hibernate多对多两种情况

    Hibernate在做多对多映射的时候,除了原先的两张表外,会多出一个中间表做关联,根据中间表的会有两种不同的配置情况: 1.中间表不需要加入额外数据. 2.中间表有其他字段,需记录额外数据. 下面, ...

  5. 导致“mysql has gone away”的两种情况

    导致“mysql has gone away”的两种情况 By Cruise 1.  wait_timeout参数 在开发代理server时, 我使用了jdbc连接数据库,并采用长连接的方式连接数据库 ...

  6. JavaScript+HTML+CSS 无缝滚动轮播图的两种方式

    第一种方式 在轮播图最后添加第一张,一张重复的图片. 点击前一张,到了第一张,将父级oList移动到最后一张(也就是添加的重复的第一张),在进行后续动画. 点击下一张,到了最后一张(也就是添加的重复的 ...

  7. html/css 关于脱离文档流的几种情况

    所谓的文档流 顾名思义就是按照顺序流下来,指的是html元素从上往下 从左往右的流式排列, 比如说写了5个Div,正常的文档流是依次显示这5个div块: 脱离文档流就是指它所显示的位置和文档代码就不一 ...

  8. django-将数据库数据转换成JSON格式(ORM和SQL两种情况)

    最近打算搞一个自动化运维平台,所以在看Django的知识. 在实际项目开发中,遇到一个小问题:前后端发生数据交互主流采用的是JSON.前端传数据到服务器端比较简单,稍微麻烦的是服务器端传JSON到前端 ...

  9. Nginx访问PHP文件的File not found错误处理,两种情况

    这个错误很常见,原有有下面两种几种 1. php-fpm找不到SCRIPT_FILENAME里执行的php文件 2. php-fpm不能访问所执行的php,也就是权限问题 第一种情况 可以在你的loc ...

随机推荐

  1. (十三)MySQL主从复制

    (1)工作原理 (2)主从实现 1) 环境介绍 cat /etc/redhat-release CentOS Linux release 7.3.1611 (Core) MySQL版本:5.7 mys ...

  2. ASP.NET中怎样将页面设为首页,加入收藏

    1.文字js脚本事件:<span onClick="var strHref=window.location.href;this.style.behavior=’url(#default ...

  3. HDU 6206 Apple【计算几何+高精度Java】

    Problem Description Apple is Taotao's favourite fruit. In his backyard, there are three apple trees ...

  4. 使用Xshell上传下载文件

    很多时候我们需要在Windows跟Linux之间,或者Linux跟Linux之间传文件,这里我们讲的是使用Xshell实现文件上传下载. 一.使用rz,sz实现Windows,linux上传下载 1. ...

  5. 【bzoj2763】[JLOI2011]飞行路线 (分层图最短路)(优先队列dij)

    [bzoj2763][JLOI2011]飞行路线 2014年3月25日1,7260 Description Alice和Bob现在要乘飞机旅行,他们选择了一家相对便宜的航空公司.该航空公司一共在n个城 ...

  6. Codeforces Round #403 (Div. 2, based on Technocup 2017 Finals )D. Innokenty and a Football League(2-sat)

    D. Innokenty and a Football League time limit per test 2 seconds memory limit per test 256 megabytes ...

  7. ansible管理window

    设置window以支持远程执行命令======================================= 升级powershell到3.0+-------------------------- ...

  8. Exchange2010启用反垃圾邮件功能

    今天邮箱服务器发现有大量发件人为空的邮件等待执行,也就是说空邮件堵塞了队列. 一般来说,空邮件就是别人发送垃圾邮件给你,你的服务上不存在这个收件人,那么系统会产生一封退信告诉你这封邮件已经被退.而ex ...

  9. git log 查看某文件的修改历史

    先进入此文件所在的目录下 1. git log --help 所有的git命令都可以通过git manual查看 在synopsis中可以看到公式  git log [<options>] ...

  10. 【数形结合】Gym - 100923I - Por Costel and the Pairs

    perechi3.in / perechi3.out We don't know how Por Costel the pig arrived at FMI's dance party. All we ...