CSS 限制文字行数(超出显示省略号...)
- /* 单行隐藏 */
- .xxx {
- /* 文本不换行 */
- white-space: nowrap;
- /* 超出范围隐藏 */
- overflow: hidden;
- /* 文字超出用省略号 */
- text-overflow: ellipsis;
- }
-
- /* 多行隐藏 */
- .xxx {
- /* 在恰当的断字点进行换行 */
- word-break: break-all;
- /* 超出范围隐藏 */
- overflow: hidden;
- /* 文字超出用省略号 */
- text-overflow: ellipsis;
- /* 盒子模型 */
- display: -webkit-box;
- /* 显示的文本行数 */
- -webkit-line-clamp: 3;
- /* 子元素的垂直排列方式 */
- -webkit-box-orient: vertical;
- }
-