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. MySQL表复制

    http://www.2cto.com/database/201202/120259.html http://www.cnblogs.com/sunss/archive/2010/10/08/1845 ...

  2. Flash型单片机的加密与解密

    厂商利用单片机进行产品开发时,都会关心其代码和数据的保密性.考虑到用户在编写和调试代码时所付出的时间和精力,代码的成本是不言而喻的.    早期的单片机,代码是交给芯片制造商制成掩膜ROM.有两种加密 ...

  3. ulimit -c unlimited

    tomcat 产生core日志: app:/usr/local/apache-tomcat-7.0.55_8082/logs# ulimit -a core file size (blocks, -c ...

  4. HashMap非线程安全分析

    通过各方资料了解,HashMap不是线程安全的,但是为什么不是线程安全的,在什么情况下会出现问题呢? 1. 下面对HashMap做一个实验,两个线程,并发写入不同的值,key和value相同,最后再看 ...

  5. HDU 1576 A/B(数论)

    题目:求(A/B)%9973,但由于A很大,我们只给出n(n=A%9973)(我们给定的A必能被B整除,且gcd(B,9973) = 1).数据给出n和b 推导过程 A/B = K K = 9973* ...

  6. 关于padding

    例子 1 padding:10px 5px 15px 20px; 上内边距是 10px 右内边距是 5px 下内边距是 15px 左内边距是 20px 例子 2 padding:10px 5px 15 ...

  7. SQLServer 循环1百万插入测试数据

    1,首先创建student表 create table student ( sno int primary key , sname VARCHAR(200) ) 2,--向数据库中插入100万条随机姓 ...

  8. Monkey Tradition（中国剩余定理）

    Monkey Tradition Time Limit: 2000MS   Memory Limit: 32768KB   64bit IO Format: %lld & %llu Submi ...

  9. Ruby新手教程和技巧

      Ruby真的比Java更好? Ruby On Rails 创始人:对Java 说再见 这两周以来环绕Java发生的两件大事:EclipseCon 和TheServerSide Java Sympo ...

  10. C++ - 容器(container)的erase()函数

    容器(container)的erase()函数 本文地址: http://blog.csdn.net/caroline_wendy/article/details/23996013 容器(contai ...