css3 省略号
Posted mailyuan
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了css3 省略号相关的知识,希望对你有一定的参考价值。
example
-
display: inline-block; width: 232px; height: 20px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
文本样式
- text-transform: ; // 控制元素中的字母(transform 变形)
-
- capitalize
- lowercase
- uppercase
- letter-spacing: ; // 字符与字符之间的距离,对中英文都有影响
- word-spacing: ; // 单词与单词之间的距离,中文无影响。
- white-space: ; // 控制文本是否换行
- white-space: nowrap; // 文本永不换行
- 使用省略号的四个条件
- 必须是 块元素 或者是 行内块元素 display: ;
- 文本必须设置 white-space: nowrap; 永不换行
- 多余文本截掉 overflow: hidden;
- 设置省略号 text-overflow: ellipsis; // 默认值为 "" 无省略号
以上是关于css3 省略号的主要内容,如果未能解决你的问题,请参考以下文章