CSS常用属性:
overflow:hidden; //超出的文本隐藏
text-overflow:ellipsis; //溢出用省略号显示
white-space:nowrap; //溢出不换行,只能显示一行 这个只是用适用于单行文本溢出情况,之前处理多行文本的话需要JS来支持。 CSS3新加属性:
display:-webkit-box; //将对象作为弹性伸缩盒子模型显示。
-webkit-box-orient:vertical; //从上到下垂直排列子元素(设置伸缩盒子的子元素排列方式)
-webkit-line-clamp:2; //需要组合上面两个属性,参数是显示的行数。 实现一个两行文本溢出省略
overflow:hidden;
text-overflow:ellipsis;
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;

css实现文本溢出省略号的更多相关文章

  1. CSS换行文本溢出显示省略号

    现代浏览器中使用css可以实现文本溢出,使用 text-overflow: ellipsis;在有些场景下没有效果,这个时候你需要检查应用的场景是是否是块元素,是否有确切的width. 如果是行内元素 ...

  2. css实现文本溢出用...显示

    文本溢出省略号显示,要实现这个必须 要有四个条件: 1.须有容器宽度:width:value 2.强制文本在一行内显示:white-space:nowrap: 3.溢出内容隐藏:overflow:hi ...

  3. CSS单行文本溢出显示省略号

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

  4. css基础 -文本溢出 text-overflow:ellipsis;

    .className{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;} 外部结构如下是就失效了:(移动端) <a class ...

  5. 浅谈文本溢出省略号代表修剪text-overflow

    一.示例 图片显示: HTML结构: CSS样式: 注意: CSS3 text-overflow 属性规定当文本溢出包含元素时发生的事情,其中 所有浏览器都支持 white-space 属性.  示例 ...

  6. css实现文本溢出显示省略号

    看到很多网站上的文章列表只显示一部分,之后就是一个阅读全文链接,或者是以一个省略号结尾.今天就说说单行文本,多行文本溢出时怎么显示省略号? 单行 overflow: hidden; white-spa ...

  7. css文本溢出省略号大总结,如你所愿

    一行: white-space: nowrap; text-overflow: ellipsis; overflow: hidden; word-break: break-all; 两行: width ...

  8. css 文本溢出省略号

    单行溢出显示省略号: white-space: nowrap; overflow: hidden; text-overflow: ellipsis; 多行溢出显示省略号: text-overflow: ...

  9. CSS换行文本溢出显示省略号,多行

    首先,div部分 <body> <div>多行的显示该如何解决呢,后面经过一番google后,我找到了chrome的一个API可以解决上面提到的需求-webkit-line-c ...

  10. css文本溢出省略号

    .ellip{ display: block; width:200px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; ...

随机推荐

  1. JS实现10进制和26进制的转换

    转载:https://blog.csdn.net/quentain/article/details/52803891 //将26进制转10进制 var ConvertNum = function (s ...

  2. 一些狗J8稳定性测试

    1.CTS 2.NTS 3.高温老化 4.DDR 稳定度 5.一些HW 指标

  3. 用for打印九九乘法表

    package com.jiemo.struct;public class ForShabi4 { public static void main(String[] args) { //1.先打印第一 ...

  4. Conda 创建、激活、克隆、删除虚拟环境 - 搬运

    Conda 创建.激活.克隆.删除虚拟环境 转自 :https://zhuanlan.zhihu.com/p/547724114 风影忍着   通常来说,对于每一个新的项目,我们都需要创建一个新的环境 ...

  5. struts 1.x框架记录

    strus-config.xml 项目目录最顶层建立配置文件strus-config.xml action 通过type绑定java类,可通过attribute被引用 MyLoginForm.java ...

  6. PHP 计算机码、位运算、运算符优先级

    计算机码 计算机在实际存储数据的时候,是采用编码规则的(二进制编码) 计算机码存储的过程: 原码.反码和补码,数值最左边一位用来充当符号位:符号为正数为0,负数为1 原码:数据本身从十进制转换为二进制 ...

  7. Android笔记-跳转到相册选择图片

    跳转到相册选择图片 即设置一个点击事件,点击之后即可跳转到相册进行图片的选择 具体的实现步骤: 界面很简单的啦,这里就直接将源代码放出来啦: <?xml version="1.0&qu ...

  8. mybatisplus数据层标准开发---分页功能

    1.创建一个拦截器类 package com.itheima.config; import com.baomidou.mybatisplus.extension.plugins.MybatisPlus ...

  9. CSS 基础属性篇组成及作用

    #### 学习目标- css属性和属性值的定义- css文本属性- css列表属性- css背景属性- css边框属性- css浮动属性##### 一.css属性和属性值的定义>属性:属性是指定 ...

  10. flutter issue---->Scaffold.of(context)

    当我们想showSnackBar的时候,需要通过Scaffold.of(context)得到Scaffold.但是如果这个context用错的话,flutter就会抛出错误.下面我们通过代码仔细看一下 ...