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. Effective Java实作Comparable - 就是爱Java

    当集合或数组内的对象需要排序时,会利用Collections.sort或Arrays.sort来进行排序,通常会implement Comparable,来实现自定义排序,透过回传值来表示排序的大小. ...

  2. SGU 294 He's Circles

    题意:一个项链有n个珠子,每个珠子为黑色或白色.问有多少种不同的项链? 注意,n的数量十分大,因此,我们枚举i(1<=i<=n),令L=n/i,求出L的欧拉函数,则这些数和L互质,因此gc ...

  3. 有空可以对C#尝一下鲜，WCF看上去很诱人（跨进程、跨机器、跨子网，跨企业网乃至跨Internet的分布式服务）

    说道底不还是要借助NGNIX实现,PHP自身呢?C#的WCF可以脱离IIS就可以实现跨进程.跨机器.跨子网,跨企业网乃至跨Internet的分布式服务,宿主可以是IIS,WinForm,WPF, Wi ...

  4. Qt5+VS2013兼容XP方法

    用Qt5+VS2013编译程序默认配置会在XP运行时报"不是有效的Win32程序"工作需要必须要XP运行 pro文件中加一句: 复制代码 QMAKE_LFLAGS_WINDOWS ...

  5. elasticsearch 性能测试

    最近花很大的经历来做性能测试,把结果整理到了ppt中,可能有个别地方不准,但是可以看看一个趋势. 主要分为两部分,一部分是写入elasticsearch性能,一部分是查询测试,elasticsearc ...

  6. OPStackComputeNodeMaintain

    1,yum -y install openstack-nova-compute计算节点配置完成后 其配置文件默认非注释行内容如下;

  7. linux下部署svn服务器

    系统Linux debian 2.6.32-5-686 先安装svn工具:apt-get install subversion,耐心等待安装完成.安装完成后svn客户端.服务器都有了. 接者建立svn ...

  8. jquery 弹出框 showDialog.js具体用法

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAABWwAAAImCAIAAABID1T7AAAgAElEQVR4nO3d329c52Hgff1HvPCNLw

  9. java 面向过程实现万年历

    public class Test { /** * @param args */ public static void main(String[] args) { // TODO Auto-gener ...

  10. cocos2dx 3.0 研究（4）渲染分析

    http://blog.csdn.net/epeaktop/article/details/26730909中已经说明了程序的设计,让我们来看看在cocos2dx 3.0中代码是怎样实现的. void ...