text-overflow ： clip | ellipsis

clip：
不显示省略标记（...），而是简单的裁切。
ellipsis：
当对象内文本溢出时显示省略标记（...）
  1. 设置或检索是否使用一个省略标记（...）标示对象内文本的溢出。对应的脚本特性为textOverflow。
  2. text-overflow属性仅是注解，当文本溢出时是否显示省略标记。并不具备其它的样式属性定义。要实现溢出时产生省略号的效果还须定义：强制文本在一行内显示（white-space:nowrap）及溢出内容为隐藏（overflow:hidden），只有这样才能实现溢出文本显示省略号的效果。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>text-overflow</title>

</head>

<body>

<style type="text/css">

.test_demo_clip{text-overflow:clip; overflow:hidden; white-space:nowrap; width:200px; background:#ccc;}

.test_demo_ellipsis{text-overflow:ellipsis; overflow:hidden; white-space:nowrap; width:200px; background:#ccc;}

</style>

<h2>text-overflow : clip </h2>

<div class="test_demo_clip">

不显示省略标记，而是简单的裁切条

</div>

<h2>text-overflow : ellipsis </h2>

<div class="test_demo_ellipsis">

当对象内文本溢出时显示省略标记

</div>

</body>

</html>

text-overflow 文字溢出时的设置的更多相关文章

  1. CSS 文字溢出时的自动隐藏

    http://www.111cn.net/cssdiv/css/34050.htm 语法:overflow : visible | auto | hidden | scroll visible::不剪 ...

  2. js 强制换行及 单行文字溢出时出现省略号

    /*强制换行*/.f-break {word-break:break-all; /*支持IE,chrome,FF不支持*/ word-wrap:break-word;/*支持IE,chrome,FF* ...

  3. CSS清除浮动&内容居中&文字溢出

    学习! 1.CSS清除浮动的方法 (1)添加标签清除浮动: 在浮动元素结尾处,并列的添加标签<div style="clear:both;"></div>. ...

  4. EditText设置文字改变时的监听

    textWatcher = new TextChangeWatcher(); etQuerryInfo.addTextChangedListener(textWatcher); /** * 文字改变类 ...

  5. HTML技巧篇：如何让单行文本以及多行文本溢出时显示省略号(…)

    参考:https://baijiahao.baidu.com/s?id=1621362934713048315&wfr=spider&for=pc 本篇文章主要给大家介绍一下在html ...

  6. css 文本单行显示溢出时出现省略号 多行显示溢出时出现省略号 首行缩进

    一.文本单行显示溢出时出现省略号 二.文本多行显示溢出时出现省略号(这种样式只能在webkit和移动端使用,包括小程序,不能设置固定高度) 三.首行缩进两字符 text-indent: 2em; 四. ...

  7. css+div解决文字溢出控制显示字数

    一.一般的文字截断(适用于内联与块):  Example Source Code [www.mb5u.com] .text-overflow {display:block;/*内联对象需加*/widt ...

  8. CSS 文本和表格中文字溢出显示省略号

    CSS控制文本超出指定宽度后用省略号代替,CSS控制文本不换行. 一般的文字截断(适用于内联与块): .text-overflow {     display:block;/*内联对象需加*/     ...

  9. css+div如何解决文字溢出

    看到标题你一定很轻易就会想到截断文字加“...”的做法.哈哈,就是这样.其实写这篇日志也只是把这样方法做个记录,因为似乎还有很多人不记得碰到这样的情况该如何处理. 首先,先解释一下,一般用div+cs ...

随机推荐

  1. [POJ] 3368 / [UVA] 11235 - Frequent values [ST算法]

    2007/2008 ACM International Collegiate Programming Contest University of Ulm Local Contest Problem F ...

  2. CloudStack cloud数据库op_host_capacity表type与控制板上的内容的对应关系

    listCapacity: type 名称 0 内存 1 CPU 3 主存储 4 公用IP地址 5 管理类IP地址 6 辅助存储 7 VLAN 9 本地存储 ViewResponseHelper.ja ...

  3. hdu 1255 覆盖的面积

    http://acm.hdu.edu.cn/showproblem.php?pid=1255 #include <cstdio> #include <cstring> #inc ...

  4. 省去在线安装 直接下载Chrome官方离线安装包

    首页>软件之家>便捷上网 省去在线安装 直接下载Chrome官方离线安装包 2013-10-12 23:22:02来源:IT之家 原创作者:阿象责编:阿象人气:54487 评论:19 谷歌 ...

  5. GitHub使用说明

    登陆https://github.com/,并注册账号 从如下地址下载windows客户端:https://msysgit.googlecode.com/files/Git-1.8.4-preview ...

  6. unix c 01

    gcc编译器(代码的 预处理/汇编/编译/连接) C程序员一般写程序会定义 .c和.h两种文件 .c文件(源文件)中一般放代码的实现,.h文件(头文件)中放 各种声明和定义.   gcc -E __. ...

  7. HDU 1394 Minimum Inversion Number(线段树 或 树状数组)

    题目大意:给出从 0 到 n-1 的整数序列,A0,A1,A2...An-1.可将该序列的前m( 0 <= m < n )个数移到后面去,组成其他的序列,例如当 m=2 时,得到序列 A2 ...

  8. hadoop深入研究:(十六)——Avro序列化与反序列化

    转载请写明来源地址:http://blog.csdn.net/lastsweetop/article/details/9773233 所有源码在github上,https://github.com/l ...

  9. Firebase远程更新应用

    能打造出色的应用不意味着一定能在商业上取得成功,两者之间还有许多工作要做,绝不能简单发布应用后就宣告“收工”.您需要能迅速根据用户反馈作出调整.测试新功能,以及向用户提供他们最关注的内容. Fireb ...

  10. 几个Linux常见命令

    ls 作用:查看目录下的文件 格式:直接ls查看当前所在目录,或者  ls 参数 /目录名 参数: -l 查看详细信息 -a 显示隐藏文件 .   表示当前目录 ..  上级目录 -G 用不同颜色标记 ...