text-overflow是CSS3的一个属性,其作用是当文本溢出包含它的元素时,应该裁剪还是将多余的字符用省略号来表示。

该属性一般和overflow:hidden属性一起使用。

text-overflow: clip|ellipsis|string

1、clip:修剪文本。即将溢出的文本裁剪掉。如以下例子,如果需要显示This is an Action,则:

white-space:nowrap; 
text-overflow:clip;
overflow:hidden;

结果:

2、ellipsis: 当文本溢出时,用省略号代替溢出的文本。如:

white-space:nowrap;
text-overflow:ellipsis;
overflow:hidden;

结果:

每天CSS学习之text-overflow的更多相关文章

  1. CSS学习笔记

    CSS学习笔记 2016年12月15日整理 CSS基础 Chapter1 在console输入escape("宋体") ENTER 就会出现unicode编码 显示"%u ...

  2. css学习归纳总结(三) 转

    原文地址:css学习归纳总结(三) 为文档添加样式的三种方法 行内样式 行内样式是写在HTML标签的style属性里的,比如: <p style="font-size: 12px;fo ...

  3. css学习归纳总结(二) 转

    原文地址:css学习归纳总结(二) 标签与元素 <p>标签和p元素有什么区别呢?大多数时候他们表示的是同一样东西,但仍有细微的区别.<p>.<div>等指的是HTM ...

  4. css学习归纳总结

    来源于:trigkit4 css学习归纳总结(一) 选择器的分组 CSS选择器分为 1.群组选择器 如:p, body, img, div{} 2.兄弟选择器 如:p + p { color:#f00 ...

  5. html+css学习总结

    HTML与css学习总结 一:html概念 1. html是一种描述网页的语言,并不是计算机语言这要分清楚:标记语言是运用一套标记标签描述网页的: 注意点: ①标签字母都要小写,标签一般都是成对出现, ...

  6. HTML, CSS学习笔记(完整版)

    第一章 div布局 前几课内容 .htm是早期的后缀.由于那时仅仅能支持长度为3的后缀.因此html与htm是一样的. shtml是server先处理然后再交给浏览器处理 #HTML小知识#之#XHT ...

  7. CSS学习笔记:溢出文本省略(text-overflow)

    原文:CSS学习笔记:溢出文本省略(text-overflow) 在CSS3中,text-overflow属性的基本语法如下: clip:表示不显示省略文本,简单的裁切. ellipsis:表示对象文 ...

  8. CSS学习笔记08 浮动

    从CSS学习笔记05 display属性一文中,我们知道div是块元素,会独占一行,即使div的宽度很小,像下面这样 应用display属性的inline属性可以让div与div共享一行,除了这种方法 ...

  9. CSS学习笔记09 简单理解BFC

    引子 在讲BFC之前,先来看看一个例子 <!DOCTYPE html> <html lang="en"> <head> <meta cha ...

  10. HTML与CSS学习记录

    title: HTML与CSS学习记录 toc: true date: 2018-09-10 14:04:59 <HTML与CSS进阶教程读书笔记> HTML基础知识 HTML与XHTML ...

随机推荐

  1. Entity Framework 学习

    Entity Framework 学习初级篇1--EF基本概况 Entity Framework 学习初级篇2--ObjectContext.ObjectQuery.ObjectStateEntry. ...

  2. 20170907wdVBA_ImportPicturesBaseOnExcel

    Public Sub ImportPicturesBaseOnExcel() Dim shp As Object Dim xlApp As Object Dim Wb As Object Dim Rn ...

  3. Hadoop-2.3.0的Eclipse插件编译

    Hadoop-2.3.0的Eclipse插件编译 #cd /usr/local/src/hadoop2x-eclipse-plugin-master/src/contrib/eclipse-plugi ...

  4. Elasticsearch SQL

    es sql是一个X-pack组件 ,允许对es执行类似sql的查询,可以将Elasticsearch SQL理解为一个编译器,既能理解es,又能理解sql.可以通过利用es,实施大规模实时读取和处理 ...

  5. 自定义session的存储机制

    <?php class MSession implements SessionHandlerInterface{ // reids 对象 protected $handler = null; / ...

  6. python基础之正则表达式 re模块

    内容梗概: 1. 正则表达式 2. re模块的使⽤ 3. 一堆练习正则表达式是对字符串串操作的一种逻辑公式. 我们一般使用正则表达式对字符串进行匹配和过滤.使用正则的优缺点: 优点: 灵活,功能性强, ...

  7. Windows下如何使用Heroku

    1. 安装 进入https://devcenter.heroku.com/articles/heroku-cli#windows,选择对应版本安装 安装后使用heroku -v可检查版本号 2. 登陆 ...

  8. [Fiddler] ReadResponse() failed: The server did not return a complete response for this request. Server returned 0 bytes.

    待解决 [Fiddler] ReadResponse() failed: The server did not return a complete response for this request. ...

  9. 第二阶段——个人工作总结DAY07

    1.昨天做了什么:昨天了解了一下时间抽也是一种ListView,然后就此学习了一下如何来修改. 2.今天打算做什么:今天在网上搜一些例子,找比较好看的界面,并实现代码. 3.遇到的困难:不知道最后连接 ...

  10. 十九、Spring框架(注解方式测试)

    一.注解方式测试 1.注解方式测试使用junit.使用junit-4.12.jar和hamcrest-all-1.3.jar(单元测试包) 把这两个jar包,导入到lib文件夹下. 2.TestSpr ...