一、文本单行显示溢出时出现省略号

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

二、文本多行显示溢出时出现省略号(这种样式只能在webkit和移动端使用,包括小程序,不能设置固定高度)

display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;

三、首行缩进两字符

text-indent: 2em;

四、划线文字

text-decoration: line-through;

css 文本单行显示溢出时出现省略号 多行显示溢出时出现省略号 首行缩进的更多相关文章

  1. CSS文本单行显示溢出时出现省略号,多行时首行缩进并出现省略号

    为了展示表格显示字数控制,比如商品类名字太长只展示部分 1.正常文本 效果: 2.单行时出现省略号 效果: 3.多行首行缩进并出现省略号 效果:

  2. CSS文本单行或者多行超出区域省略号(...)显示方法

    单行超出时,主要用到几个CSS属性: 1.text-overflow : clip | ellipsis ; clip : 不显示省略标记(...),而是简单的裁切ellipsis : 当对象内文本溢 ...

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

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

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

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

  5. 转载 | CSS实现单行、多行文本溢出显示省略号(…)

    本文引自:https://www.cnblogs.com/wyaocn/p/5830364.html 首先,要知道css的三条属性. overflow:hidden; //超出的文本隐藏 text-o ...

  6. css自动省略号...,通过css实现单行、多行文本溢出显示省略号

    网页开发过程中经常会遇到需要把多行文字溢出显示省略号,这篇文章将总结通过多种方法实现文本末尾省略号显示. 一.单行文本溢出显示省略号(…) 省略号在ie中可以使用text-overflow:ellip ...

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

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

  8. CSS实现单行、多行文本溢出显示省略号

    单行显示省略号 overflow: hidden; text-overflow:ellipsis; white-space: nowrap;多行显示省略号 display: -webkit-box; ...

  9. 单行文字溢出和多行文字溢出省略号显示的CSS样式

    单行文字溢出,CSS样式 <h6 style="width:70px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis ...

随机推荐

  1. Docker入门-常用命令

    Docker镜像操作 Docker运行容器前需要本地存在对应的镜像,如果本地不存在该镜像,Docker会从镜像仓库下载该镜像. 获取镜像 从Docker镜像仓库获取镜像的命令是docker pull. ...

  2. 第七周总结&实验报告5

    这一周的课程内容比较难,而且比较不容易理解,所有学习的很吃力,现在接触的知识越来越多,也越来越难了,还是要多对照书本来进行学习! 这周主要学的有: 一.抽象类 1.Java中可以创建一种类专门用来当作 ...

  3. shell脚本获取绝对路径

    当前脚本全路径 echo $(readlink -f "$0") 获取绝对路径(不带文件名) echo $(dirname $(readlink -f "$0" ...

  4. 4. 获取当前的文件夹的路径,以及当前文件名的路径 os.path.realpath

    使用os.path.realpath(__file__) 获得当前的文件夹的路径名, 使用os.path.split 进行路径切割 import os src, _= os.path.split(os ...

  5. 集成ShareSdk一键分享和第三方登录

    在Mob官网http://mob.com/注册,创建应用,下载SDK,申请APP_key 根据官网开发指南导入SDK到你的项目中: 在assets/ShareSDk.xml中修改你的APP_key p ...

  6. python字符串判断

    s为字符串 s.isalnum() 所有字符都是数字或者字母 s.isalpha() 所有字符都是字母 s.isdigit() 所有字符都是数字 s.islower() 所有字符都是小写 s.isup ...

  7. Report List 报表开发

    1. Report List的输出定义 * ...NO STANDARD PAGE HEADING: 输出的报表不包含表头: * ...LINE-SIZE col : 输出的报表不包含表头: * .. ...

  8. vsftp新建用户及目录时遇到的坑

    1.有关vsftp配置及用户权限设置,请参考: http://blog.sina.com.cn/s/blog_3edc5e2e0102vzv8.html 2.需求:公司另一部门要求单独建一目录,来存在 ...

  9. opencv的曲线拟合polyfit

    推荐一个不错的网页,可以直接用solve函数求解方程组: http://m.blog.csdn.net/u014652390/article/details/52789591 4.1 曲线拟合的最小二 ...

  10. ARM的编程模式及寄存器

    根据朱老师的课程及下面博客整理 http://blog.chinaunix.net/uid-20443992-id-5700979.html ARM 采用的是32位架构 ARM 约定: Byte : ...