width: 50px; overflow:hidden;white-space:nowrap; text-overflow:ellipsis;

设置或检索是否使用一个省略标记(...)标示对象内文本的溢出。

对应的脚本特性为text-Overflow。

---------------------------------------------------------------------------------

语法:   text-overflow : clip | ellipsis  

参数:   

clip : 不显示省略标记(...),而是简单的裁切   

ellipsis : 当对象内文本溢出时显示省略标记(...)   

text-overflow属性仅是注解,当文本溢出时是否显示省略标记。并不具备其它的样式属性定义。我们想要实现溢出时产生省略号的效果。还必须定义:强制文本在一行内显示(white-space:nowrap)及溢出内容为隐藏(overflow:hidden)。只有这样才能实现溢出文本显示省略号的效果。   

--------------------------------------------------------------------------------

语法: 

overflow : visible | auto | hidden | scroll 

取值: 

visible :  默认值。不剪切内容也不添加滚动条。假如显式声明此默认值,对象将以包含对象的 window 或 frame 的尺寸裁切。并且 clip 属性设置将失效 

auto :  在必需时对象内容才会被裁切或显示滚动条 

hidden :  不显示超过对象尺寸的内容 

scroll :  总是显示滚动条

一、仅定义text-overflow:ellipsis; 不能实现省略号效果。   

二、定义text-overflow:ellipsis; white-space:nowrap; 同样不能实现省略号效果   

三、同时应用: text-overflow:ellipsis; white-space:nowrap; overflow:hidden; 可实现所想要得到的溢出文本显示省略号效果:

css控制标题长度超出部分显示省略号的更多相关文章

  1. CSS控制文字,超出部分显示省略号

    http://www.daqianduan.com/6179.html <p style="width: 300px;overflow: hidden;white-space: now ...

  2. destoon控制标题长度,title中显示全标题 标题字符长度怎么控制?

    如题商品调用出来后,标题的字符长度怎么控制?有哪位高手能帮我解决吗? 小弟在此感谢了. &length=30 //30表示30个字节 <!--{tag("moduleid=5& ...

  3. css文本强制两行超出就显示省略号,不显示省略号

    1. 强制一行的情况很简单 overflow:hidden; //超出的隐藏 text-overflow:ellipsis; //省略号 white-space:nowrap; //强制一行显示 2. ...

  4. css控制文字长度,超出长度显示...

    css控制文字长度,超出长度显示... .style { max-width: 165px; overflow: hidden; white-space: nowrap; text-overflow: ...

  5. JS控制文字只显示两行,超出部分显示省略号

    由于使用css控制文字只显示多行,超出部分显示省略号,存在一定的兼容性问题,所以总结了一下网上一些大咖使用js实现控制行数的解决方案. 第一步:依次引入jquery.js+jquery.ellipsi ...

  6. css 超出部分显示省略号

    代码: overflow: hidden; white-space: nowrap;  text-overflow: ellipsis; 重点代码:text-overflow: ellipsis; 解 ...

  7. CSS实现单行、多行文本超出部分显示省略号

     单行文本超出,代码如下: css代码: <style> .one{ width:200px; overflow: hidden; text-overflow:ellipsis; whit ...

  8. css文字超出自动显示省略号

    只针对单行文本有效: 01.针对块状元素 ul li{ width: 180px; text-overflow: ellipsis; white-space: nowrap;/*禁止自动换行*/ ov ...

  9. CSS——文本超出隐藏显示省略号

    文本超出隐藏显示省略号 1.单行文本的溢出显示省略号 overflow: hidden; text-overflow:ellipsis; white-space: nowrap; // overflo ...

随机推荐

  1. WCF项目中出现常见错误的解决方法:基础连接已经关闭: 连接被意外关闭

    在我们开发WCF项目的时候,常常会碰到一些莫名其妙的错误,有时候如果根据它的错误提示信息,一般很难定位到具体的问题所在,而由于WCF服务的特殊性,调试起来也不是那么方便,因此往往会花费不少时间来进行跟 ...

  2. Unicode中文和特殊字符的编码范围

    编程中有时候需要用到匹配中文的正则,一般用 [ \u4e00-\u9fa5]+ 即可搞定.不过这正则对一般的火星文鸟语就不太适用了,甚至全角的标点符号都不包含在内.例如游戏里面的玩家名,普通青年一般都 ...

  3. Mac OS 的一点历史: Mac OS, Mac OSX 与Darwin

    作为收购 NeXT 公司的结果,苹果公司获得了 NeXTSTEP 架构中的 Mach 和 Objective-C 等设计.尽管 NeXTSTEP 本身已经不再发展了,但是其中的组件在 OS X 中获得 ...

  4. Java/Android引用类型及其使用分析

    Java/Android中有四种引用类型,分别是: Strong reference     - 强引用Soft Reference        - 软引用Weak Reference      - ...

  5. 【C#】1.3 WPF应用程序学习要点

    分类:C#.VS2015 创建日期:2016-06-14 使用教材:十二五国家级规划教材<C#程序设计及应用教程>(第3版) 一.要点概述 <C#程序设计及应用教程>(第3版) ...

  6. Adb connection Error:远程主机强迫关闭了一个现有的连接

    在用手机调试程序时,有时会出现“Adb connection Error:远程主机强迫关闭了一个现有的连接”的错误. 出现这种错误时,可以按照以下步骤解决: (1)运行cmd.exe,并将目录CD到\ ...

  7. WPS添加页码不是从首页开始

    A.页码从第二页开始 "插入"--"页码"--"格式"--不选"续前页"--"起始页码"设为0 &q ...

  8. hibernate----1-1-----两表关联属性放在另一个表里面

    package com.ij34.dao; import javax.persistence.*; @Entity @Table(name="Address_inf") publi ...

  9. Java程序内存的简单分析

    这篇文章将简单的说明下当我们运行Java程序时JVM(Java虚拟机)的内存分配情况. 首先我们先来感观的认识下几个名词: 1.栈,一般来说,基本数据类型直接在栈中分配空间,局部变量(在方法代码段中定 ...

  10. Android填坑系列:Android JSONObject 中对key-value为null的特殊处理

    在与服务端通过JSON格式进行交互过程中,不同版本的JSON库在对于key-value为null情况上的处理不同. Android自带的org.json对key-value都要求不能为null,对于必 ...