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. ps存jpeg，格式保存的时候为什么选择“基线”

    jpeg是印前和网页设计常用的格式,最大好处就是能很大程度上压缩图像大小. 在ps中将图片保存为jpeg格式的时候会出现以下选项: 其中:图像选项都很熟悉,是关于图像质量的:而格式选项的用途主要是针对 ...

  2. LeetCode_Triangle

    Given a triangle, find the minimum path sum from top to bottom. Each step you may move to adjacent n ...

  3. QProcess进程间双向通信

    记得以前写过Linux的C程序, 里面用popen打开一个子进程, 这样可以用read/write和子进程通讯, 而在子进程里则是通过从stdin读和向stdout写实现对父进程的通讯. QProce ...

  4. mybatis和ibatis区别

     ibatis本是apache的一个开源项目,2010年这个项目由apache software foundation 迁移到了google code,并且改名为mybatis.  1.Mybat ...

  5. c++ 07

    一.多重继承 1)子类同时拥有两个或两个以上的基类,同时继承了所有基类的属性和行为. 销售员    经理       \  /     销售经理 汽车 客用特性 商用特性    \    |    / ...

  6. <转载>Wait and Waitpid

    转载http://www.cnblogs.com/lihaosky/articles/1673341.html 一.Wait #include <sys/types.h> /* 提供类型p ...

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

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

  8. python list 中找连续的数字(由网友处学习)

    # -*- coding: utf-8 -*- # python:2.x __author__ = 'Administrator' #学习这个要求的:http://wsky.org/archives/ ...

  9. C#实现下载功能，可用于软件自动更新

    以前在百度写的文档,转移到此处 软件截图: 代码下载: http://twzy.ys168.com/   在代码下载文件夹中 //代码: using System; using System.Comp ...

  10. XSS第二节，XSS左邻右舍

    昨天的文章中引用了OWASP2013年的江湖排名,今天来看一下TOP中XSS的左邻右舍都是谁,先看一下他们的大名,再进一步介绍 [以下主要翻译自https://www.owasp.org/index. ...