.twoline{
display: -webkit-box !important;;
overflow:hidden;
text-overflow: ellipsis;
word-break: break-all;
-webkit-box-orient:vertical;
-webkit-line-clamp:4;
}
.oneline{
text-overflow: ellipsis;
overflow:hidden;
white-space: nowrap;
}

省略号 对单行 多行的css的更多相关文章

  1. css文本溢出隐藏显示省略号（单行+多行）

    文本超出若干行就换行,这个功能几乎每个文本浏览网站都会用到,实现它的办法也有很多,今天简单的介绍一下实现它的方法.  一. 单行文本不换行,并将超出文本隐藏 .box-content{     ove ...

  2. css文字单行/多行超出显示省略号...

    css文字单行/多行超出显示省略号... 项目里写css样式我们经常会遇到将文字超出显示省略号的情况,记录一下以后能用到. 单行超出 .oneline { width:300upx; /*宽度一定要设 ...

  3. HTML5 元素文字超出部分显示省略号（支持多行），兼容几乎所有常用浏览器

    1,公共样式,在公共的 CSS 文件中加入以下内容  /* 超出部分显示省略号,支持多行 */ .text-ells:before { content: ''; float: left; width: ...

  4. CSS文本单行显示溢出时出现省略号,多行时首行缩进并出现省略号

    为了展示表格显示字数控制,比如商品类名字太长只展示部分 1.正常文本 效果: 2.单行时出现省略号 效果: 3.多行首行缩进并出现省略号 效果:

  5. 文本超出显示省略号/数字英文字母折行有关css 属性/显示两行，第二行省略号显示css方法

    文本超出显示省略号: 定容器宽度 overflow: hidden; text-overflow: ellipsis; 文本超出显示省略号 white-space:nowrap;  强制文本不换行 折 ...

  6. 微信小程序-超出部分显示省略号（单行与多行）

    /*单行*/ .work_font{ display:block /*这里设置inline-block或者block:根据使用情况来定(行内元素需要加这个,块级元素和行内块级可以不用)*/ white ...

  7. 移动端小总结(1)---meta、input和单行多行文字溢出省略号

    一.常用META 1. 添加到主屏后的标题(IOS) 1 <meta name="apple-mobile-web-app-title" content="标题&q ...

  8. css 单行/多行文字垂直居中问题

    例子可以直接看这里http://www.zhangxinxu.com/study/200911/line-height-text-v-center.html 这篇文章中有一点点解释http://blo ...

  9. div垂直居中的N种方法 单行/多行文字(未知高度/固定高度)

    说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的 CSSHack技术就可以啊!所以在这里我还要啰嗦两句,CSS中的 ...

随机推荐

  1. [工作中的设计模式]策略模式stategy

    一.模式解析 策略模式定义了一系列的算法,并将每一个算法封装起来,而且使它们还可以相互替换.策略模式让算法独立于使用它的客户而独立变化. 策略模式的关键点为: 1.多种算法存在 2.算法继承同样的接口 ...

  2. 07 JavaWeb

    软件开发的两种架构:c/s和b/s          * C/S     client/server     客户端/服务器     例子:QQ     快播     暴风影音...          ...

  3. qq邮箱邮我组件

    http://openmail.qq.com/cgi-bin/qm_help_mailme?sid=uvkgSu7e0aOrc0Qc&t=open_mailme 邮我 使用"邮我&q ...

  4. Bridge模式——对象结构型模式

    今天看了Bridge模式,对其进行简单的总结,并给出几篇通俗易懂的文章链接. (一)意图--将抽象部分和它的实现部分分离,使它们都可以独立地变化. 适用于从多维度描述的类型,拆解开来,使其能沿着各维度 ...

  5. varchar和Nvarchar区别

    http://www.cnblogs.com/yelaiju/archive/2010/05/29/1746826.html Unicode字符集就是为了解决字符集这种不兼容的问题而产生的,它所有的字 ...

  6. ural 2062 Ambitious Experiment

    2062. Ambitious Experiment Time limit: 3.0 secondMemory limit: 128 MB During several decades, scient ...

  7. Codeforces Round #209 (Div. 2) B. Permutation

    解题思路: 如果序列a是单调递增的,则序列为1,2,..... 2n,则将给出的式子化简得Σ(a2i - a2i-1) = n 如果序列a是单调递减的,则序列为2n,.........2, 1,则将给 ...

  8. [题解+总结]NOI2015

    // 此博文为迁移而来,写于2015年7月20日,不代表本人现在的观点与看法.原始地址:http://blog.sina.com.cn/s/blog_6022c4720102w6u7.html 1.总 ...

  9. git两种合并方法 比较merge和rebase

    18:01 2015/11/18git两种合并方法 比较merge和rebase其实很简单,就是合并后每个commit提交的id记录的顺序而已注意:重要的是如果公司用了grrit,grrit不允许用m ...

  10. BZOJ3105: [cqoi2013]新Nim游戏 博弈论+线性基

    一个原来写的题. 既然最后是nim游戏,且玩家是先手,则希望第二回合结束后是一个异或和不为0的局面,这样才能必胜. 所以思考一下我们要在第一回合留下线性基 然后就是求线性基,因为要取走的最少,所以排一 ...