1. text-overflow属性配合overflow才有效果，还记得把文字强制一行显示，如下代码：
  1. <!DOCTYPE html>
  2. <html lang="zh-cn">
  3. <head>
  4. <meta charset="utf-8" />
  5. <title>text-overflow</title>
  6. <meta name="author" content="Guxingzhe" />
  7. <style>
  8. .test li {
  9. 	margin-top: 10px;
  10. }
  11.  
  12. .test .clip label {
  13. 	display: inline-block;
  14. 	overflow: hidden;
  15. 	width: 200px;
  16. 	white-space: nowrap;
  17. 	text-overflow: clip;
  18. }
  19.  
  20. .test .ellipsis label {display: inline-block;
  21. 	overflow: hidden;
  22. 	width: 200px;
  23. 	white-space: nowrap;/*  强制在同一行内显示所有文本，直到文本结束或者遭遇br对象。  */
  24. 	text-overflow: ellipsis;
  25. }
  26. </style>
  27. </head>
  28. <body>
  29. 	<ul class="test">
  30. 		<li class="clip"><strong>clip: 直接将溢出的文字裁剪</strong>
  31. 			<label>测试用文字测试用文字测试用文字测试用文字测试用文字测试用文字</label></li>
  32. 		<li class="ellipsis"><strong>ellipsis: 将溢出的文字显示省略标记（...）</strong>
  33. 			<label>测试用文字测试用文字测试用文字测试用文字测试用文字测试用文字</label></li>
  34. 	</ul>
  35. </body>
  36. </html>

效果图：

text-overflow简单使用的更多相关文章

  1. Mac Sublime Text 2 简单使用

    按 Ctrl+` 调出 console 粘贴以下代码到底部命令行并回车: import urllib2,os;pf='Package Control.sublime-package';ipp=subl ...

  2. Rails6.0 Beta版本1: Action Text的简单使用

    主要功能是新增2个主要的框架Mailbox和action Text. 和2个重要的可扩展的升级: multiple databases support和parallel testing. Action ...

  3. Python学习笔记（二）使用Sublime Text编写简单的Python程序（）

    一.使用Sublime Text编写Python 1.点击“文件” →”新建文件“ 2.点击”文件“→”保存“,并保存为.py文件 此时已经创建好Python文件了,接下来就可以编写Python程序了 ...

  4. application/x-www-form-urlencoded、application/json、multipart/form-data、text/xml简单总结

    最近在数据传输时,一直不明白这四种的区别,查了很多资料,也还是感到很模糊,因此,简单总结一下,以后再完善 1.在GET方式传输数据中,这四种格式,后台都可以接收数据(原生的request.getPar ...

  5. Sublime Text 全程指引 by Lucida

    作者:Lucida 微博:@peng_gong 豆瓣:@figure9 博客园:@figure9 原文链接:http://zh.lucida.me/blog/sublime-text-complete ...

  6. Sublime Text 全程指南

    摘要(Abstract) 本文系统全面的介绍了 Sublime Text,旨在成为最优秀的 Sublime Text 中文教程. 更新记录 2014/09/27:完成初稿 2014/09/28: 更正 ...

  7. Sublime Text使用教程【转】

    本文转载自:http://lucida.me/blog/sublime-text-complete-guide/ 摘要(Abstract) 本文系统全面的介绍了 Sublime Text,旨在成为最优 ...

  8. Sublime Text 教程

    编辑器的选择(Editor Choices) 从初学编程到现在,我用过的编辑器有EditPlus.UltraEdit.Notepad++.Vim.TextMate和Sublime Text,如果让我从 ...

  9. [工具] Sublime Text 使用指南

    http://bbs.it-home.org/thread-46291-1-1.html 摘要(Abstract) 更新记录 更正打开控制台的快捷键为Ctrl + ` 更正全局替换的快捷键为Ctrl ...

  10. Sublime Text指南

    转自: http://lucida.me/blog/sublime-text-complete-guide/  摘要(Abstract) 本文系统全面的介绍了Sublime Text,旨在成为最优秀的 ...

随机推荐

  1. [置顶] Android访问控制系统测试与评估

    5.1实验方案 通过以上章节,本文阐述了目前Android平台上的恶意软件以“隐私窃取”和“恶意扣费”类为主,本研究课题访问控制的目标也正是阻止恶意软件“隐私窃取”和“恶意扣费”的行为,因此,本实验方 ...

  2. SQL 2008 R2 数据库镜像操作

    镜像操作请参考:http://blog.csdn.net/dba_huangzj/article/details/35995083 应用程序数据库连接字符串(带见证服务器即自动故障转移): DBHel ...

  3. OD: Windows Security Techniques & GS Bypassing via C++ Virtual Function

    Windows 安全机制 漏洞的万源之本在于冯诺依曼设计的计算机模型没有将代码和数据进行区分——病毒.加壳脱壳.shellcode.跨站脚本攻击.SQL注入等都是因为计算机把数据和代码混淆这一天然缺陷 ...

  4. HTML 5 与HTML 4 的区别

    (1)HTML 5 与HTML 4 的相比,语法的改变,以下四个方面: 字符编码改变举例: 省略标记值: (2)新增和废弃的元素 (3)新增html全局属性 (1)指定元素是否可编辑 (2)指定页面是 ...

  5. Spring框架快速入门之简介

    Spring是java平台上的一个开源应用框架.它的第一个版本是由Rod Johnson写出来的.Rod在他的Expert One-On- One Java EE Design and Develop ...

  6. JS 函数参数

    1.简单的无参函数调用 function Test1(Func) { Func(); } function Test2() { alert("我要被作为函数参数啦!"); } // ...

  7. .NET定时发送邮件

    添加一个全局应用程序类Global.asax 代码会在访问网站时运行 Global.asax代码: void Application_Start(object sender, EventArgs e) ...

  8. 概率dp小结

    好久之前学过,记得是一次亚洲区的前几天看了看概率dp,然后亚洲区就出了一道概率dp,当时虽然做上了,但是感觉有很多地方没懂,今天起早温习了一下,觉得很多地方茅塞顿开,果然学习的话早上效果最好了. 首先 ...

  9. 《javascript设计模式》--接口

    关于javascript设计模式书中的接口,记录如下 //TODO  增加了一个判断条件,可以只在生产环境中调用 接口var Interface = function(name,methods){ i ...

  10. mysql在linux的安装