宽度不固定，超出宽度则以省略号“...”来表示。 /*规定段落中的文本不进行换行：*/ white-space: nowrap; overflow: hidden; /* text-overflow属性表示规定当文本溢出包含元素时发生的事情; ellipsis表示显示省略符号来代表被修剪的文本。*/ ...
分类：
Web程序 时间：
2020-07-19 11:51:01
阅读次数：
106
单行： white-space:nowrap; overflow:hidden; text-overflow:ellipsis; 多行： word-break: break-all; text-overflow: ellipsis; overflow: hidden; display: -webki ...
分类：
Web程序 时间：
2020-07-15 22:46:33
阅读次数：
93
1、显示效果 2、代码展示 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> .divMaxShow:hover { overflow: hidden; text-o ...
分类：
Web程序 时间：
2020-07-12 17:01:58
阅读次数：
77
-webkit-line-clamp: 2; 2行显示 配合下面两个 text-overflow: ellipsis; 多出部分显示省略号 -webkit-box-orient: vertical; // 从上到下垂直排列子元素（设置伸缩盒子的子元素排列方式） display: -webkit-bo ...
分类：
其他好文 时间：
2020-07-12 00:48:06
阅读次数：
87
在下面的代码中加两行注释就可以了 overflow:hidden; text-overflow:ellipsis; display:-webkit-box; /* autoprefixer: off */ -webkit-box-orient:vertical; /* autoprefixer: o ...
分类：
其他好文 时间：
2020-07-08 01:01:13
阅读次数：
48
1、vertical-align属性 （1）使用场景 经常用于设置图片或者表单和文字的垂直对齐，用于设置一个元素的垂直对齐方式，但是他只针对于行内元素或行内块元素 （2）属性值 baseline：默认值，元素放置在父元素的基线上 top：把元素的顶端与行中最高元素的顶端对齐 middle：把此元素放 ...
分类：
Web程序 时间：
2020-07-06 21:33:53
阅读次数：
98
/**参数说明： * 根据长度截取先使用字符串，超长部分追加… * str 对象字符串 * len 目标字节长度 * 返回值： 处理结果字符串 */ function cutString(str, len) { if (str.length * 2 <= len) { //length属性读出来的汉 ...
分类：
Web程序 时间：
2020-07-04 15:37:26
阅读次数：
108
CSS 中文开发手册 文本溢出 | text-overflow (Basic User Interface) - CSS 中文开发手册 text-overflowCSS属性确定如何向用户发出未显示的溢出内容信号。它可以被剪切，显示一个省略号（'...'，U + 2026 HORIZONTAL ELL... ...
分类：
Web程序 时间：
2020-06-30 22:55:09
阅读次数：
88
重点：text-overflow: ellipsis;只对display：inline；起作用 例子： <span class="a">我说说<b class="b">打瞌睡党风建设打火机</b>说说色儿</span> a{ display:block/inline-block; width:100 ...
分类：
Web程序 时间：
2020-06-30 11:08:56
阅读次数：
55
css之字体多行省略（兼容大部分浏览器） 字体单行显示省略号 <style> .box1{ width: 500px; height: 1.5em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } </style> ...
分类：
Web程序 时间：
2020-06-28 11:20:06
阅读次数：
98
