css 文本单行显示溢出时出现省略号 多行显示溢出时出现省略号 首行缩进
一、文本单行显示溢出时出现省略号
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 文本单行显示溢出时出现省略号 多行显示溢出时出现省略号 首行缩进的更多相关文章
- CSS文本单行显示溢出时出现省略号,多行时首行缩进并出现省略号
为了展示表格显示字数控制,比如商品类名字太长只展示部分 1.正常文本 效果: 2.单行时出现省略号 效果: 3.多行首行缩进并出现省略号 效果:
- CSS文本单行或者多行超出区域省略号(...)显示方法
单行超出时,主要用到几个CSS属性: 1.text-overflow : clip | ellipsis ; clip : 不显示省略标记(...),而是简单的裁切ellipsis : 当对象内文本溢 ...
- css文本溢出隐藏显示省略号(单行+多行)
文本超出若干行就换行,这个功能几乎每个文本浏览网站都会用到,实现它的办法也有很多,今天简单的介绍一下实现它的方法. 一. 单行文本不换行,并将超出文本隐藏 .box-content{ ove ...
- #CSS 文本溢出部分显示省略号
单行结尾溢出: 用text-overflow:ellipsis属性实现,当然还需要加宽度width属来兼容部分浏览. width:300px;overflow: hidden; text-overfl ...
- 转载 | CSS实现单行、多行文本溢出显示省略号(…)
本文引自:https://www.cnblogs.com/wyaocn/p/5830364.html 首先,要知道css的三条属性. overflow:hidden; //超出的文本隐藏 text-o ...
- css自动省略号...,通过css实现单行、多行文本溢出显示省略号
网页开发过程中经常会遇到需要把多行文字溢出显示省略号,这篇文章将总结通过多种方法实现文本末尾省略号显示. 一.单行文本溢出显示省略号(…) 省略号在ie中可以使用text-overflow:ellip ...
- CSS 文本溢出时显示省略标记
如标题所示... <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.o ...
- CSS实现单行、多行文本溢出显示省略号
单行显示省略号 overflow: hidden; text-overflow:ellipsis; white-space: nowrap;多行显示省略号 display: -webkit-box; ...
- 单行文字溢出和多行文字溢出省略号显示的CSS样式
单行文字溢出,CSS样式 <h6 style="width:70px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis ...
随机推荐
- 第十四周课程总结&记事本功能的简单实现。
(1)课程总结: 这周简单学习了下JDBC的内容: JDBC API 允许用户访问任何形式的表格数据,尤其是存储在关系数据库中的数据. 执行流程: (1)连接数据源,如:数据库. (2)为数据库传递查 ...
- DS博客大作业--树 (陈梓灿组)
1.树的存储结构说明 定义的结构体中,name是用于存放文件名称,string类型是字符串类型,定义了child孩子结点和brother兄弟结点. 2.树的函数说明 1.main函数 main函数中主 ...
- 数据库 mysql 操作
安装好xammp,打开阿帕奇和数据库服务: 点击右侧 shell 按钮,进入命令行: 首先,利用超级管理员权限进入数据库: mysql -uroot -p enter,再enter 把下述代码复制进命 ...
- web长时间不激活 终止用户回话
参考资料: http://web.jobbole.com/89072/ http://www.cnblogs.com/1175429393wljblog/p/5570606.html http://w ...
- 【Spark机器学习速成宝典】模型篇06随机森林【Random Forests】(Python版)
目录 随机森林原理 随机森林代码(Spark Python) 随机森林原理 参考:http://www.cnblogs.com/itmorn/p/8269334.html 返回目录 随机森林代码(Sp ...
- leetcode-easy-listnode-88 Merge Sorted Array-NO
mycode 不会........... 参考 思路:从后往前计算,这样不会覆盖nums1中的有效值 由于 You may assume that nums1 has enough space (si ...
- ajaxfrom 和ajaxgird的区别
ajaxfrom 和ajaxgird区别ajaxfrom适合单条数据,主要是用来显示主表的信息<hy:ajaxform2 id="ajaxform" name="d ...
- easyui tree checkbox 单选控制
参考文档:中文网:http://www.jeasyui.net/plugins/185.html easyui-tree的checkbox默认是多选的, 如何控制只能单选一个子节点,看代码: $('# ...
- 十九:jinja2之set和with语句定义变量
set jinja2模板内部可以用set定义变量,只要定义了这个变量,在后面的代码中都可以使用此变量 with 如果想让定义的变量只在部分作用域内有效,则不嫩更实用set,需使用with定义,with ...
- PS 之图片中抠出大树
工具:Photoshop CC2017 原图:(目的是将大树从图片中抠出) 操作: 1.打开要抠图的图片,然后执行:[图层]---->[新建调整图层]---->[反相]---->[在 ...