css 只好显示两行 超过显示点点点

css 只能显示两行 超过显示点点点

css 可以做到:
.p1{
text-align: center;
color:#C8CFD6;
height:34px;
text-overflow: -o-ellipsis-lastline;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;
}

时间: 2024-08-25 18:00:30

css 只好显示两行 超过显示点点点的相关文章

css只显示两行 超过显示点点点

.p1{ text-align: center; color:#C8CFD6; height:34px; text-overflow:-o-ellipsis-lastline; overflow:hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

css使文字显示两行后显示省略号

本人喜欢把一些实用的东东拿过来,写成文章或者收藏起来.于是乎... 直接上代码: .article { color: #000000; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all; } 狠狠的点击,查看效果吧 原文地址:https://www.cnblogs.com/homehtml/p/12625871.htm

怎么实现CSS限制字数,超出部份显示点点点.

如何实现CSS限制字数,超出部份显示点点点... <div style="width:200px; white-space:nowrap;overflow:hidden;text-overflow:ellipsis; border:1px solid red">试试看试试看试试看试试看试试看试试看试试看试试看试试看试试看试试看</div> 效果: 语法: text-overflow : clip | ellipsis 参数: clip : 不显示省略标记(...

CSS div内文字显示两行,超出部分省略号显示

1. 概述 1.1 说明 在项目过程中,有时候需要控制div内文字最多显示两行,超出的使用省略号进行处理.使用识别码/前缀-webkit进行处理可直接得到相应效果. 1.1 -webkit WebKit内核的css前缀为“-webkit-”,Comodo Drangon(科摩多龙),苹果,安卓,搜狗高速浏览器3,快快浏览器,枫树浏览器,云游浏览器,360极速浏览器,世界之窗极速版,SRWare Iron,猎豹浏览器,RockMelt,QQ浏览器都可识别. 备注:IOS版的微信.android版本

CSS实现div内文字显示两行,超出两行部分省略号显示

在搭建前台文章列表中,需要实现div内文字显示两行,超出的则省略号显示. 找了很多,都貌似只能一行显示.最后在百度知道找到答案. 答案转自百度知道,题主的自答. 用的是-webkit-私有属性.text-overflow: -o-ellipsis-lastline;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical; 另有回

div内文字显示两行,多出的文字用省略号显示

用-webkit-私有属性,代码如下:text-overflow: -o-ellipsis-lastline;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical; 另外还有其他方法可以解决这个问题:1.通过js来控制字数,然后截取文字下面是一个例子: <!DOCTYPE html><html><head&

用CSS来控制字符长度和显示长度

在网页排版设计中,会遇到文本超过固定长度导致整体的网页变形的情况.程序员往往需要截取固定的长度来实现某些固定长度的控制.介绍一种直接采 用CSS的代码控制来实现文本截取的方法,与程序员的直接字符截取的方式有些区别,其优势是可以自动控制文本显示的长度:缺点是不同浏览器的兼容性并不完 美. 使用overflow,text-overflow,white-space这三个主要的属性,其他的代码属于修饰作用. CSS代码: <style> .texthidden{ width:200px; overfl

img只显示图片一部分 或 css设置背景图片只显示图片指定区域

17:14 2016/3/22img只显示图片一部分 或 css设置背景图片只显示图片指定区域 background-position: 100% 56%; 设置背景图片显示图片的哪个坐标区域,图片左上角为0,0或0%,0%,右下角为高度和宽度,或100%,100%. clip:rect(300px 100px 300px 0px); 设置显示图片的某个区域,分别是上右下左的顺序设置 部分代码:<style type="text/css">img {position:abs

2017-3-14文章名 css解决标题背景 不显示文字

2017-3-14文章名 css解决标题背景 不显示文字 标签 text-indent: 100%; white-space: nowrap; overflow: hidden; 隐藏文字 以图代字