在css3出现之前,一般采用substring来进行截取,现在 不用js,纯css3也能进行截取了:

text-overflow:clip | ellipsis

1.clip: 要在一定的高度内,配合overflow:hidden才有效,若没有overflow:hidden;将 不会有任何效果;

2.ellipsis:将超出的部分用省略号表示,需要配合overflow:hidden和white-space:nowrap一起使用才有效果。

css3进行截取的更多相关文章

  1. CSS3:text-overflow实现文字截取,超出部分显示省略号

    1. 概述 使用text-overflow:ellipsis对溢出文本显示省略号有两个好处, 一是不用通过后端程序截取: 二是有利于SEO. 2. text-overflow的属性 clip: 当对象 ...

  2. css3 属性 text-overflow 实现截取多余文字内容 以省略号来代替多余内容

    css3 属性 text-overflow: ellipsis 前言 正文 结束语 前言 我们在设计网站的时候有时会遇到这样一个需求:因为页面空间大小的问题,需要将多余的文字隐藏起来,并以省略号代替, ...

  3. 深入理解CSS3 Animation 帧动画

    CSS3我在5年之前就有用了,包括公司项目都一直在很前沿的技术. 最近在写慕课网的七夕主题,用了大量的CSS3动画,但是真的沉淀下来仔细的去深入CSS3动画的各个属性发现还是很深的,这里就写下关于帧动 ...

  4. CSS3与页面布局学习总结(六)——CSS3新特性(阴影、动画、渐变、变形、伪元素等)

    CSS3在CSS2.1的基础上新增加了许多属性,这里选择了较常用的一些功能与大家分享,帮助文档中有很详细的描述,可以在本文的示例中获得帮助文档. 一.阴影 1.1.文字阴影 text-shadow&l ...

  5. 转载——CSS3 Object-fit和Object-position

    在响应式设计(RWD)中,令大家最头痛的问题的是图片的自适应处理问题.往往我采取的处理方式是给图片的容器设置一个尺寸,然后给图片设置下面的代码: img { max-width: 100%; heig ...

  6. CSS3魔法堂:说说Multi-column Layout

    前言  是否记得<读者文摘>中那一篇篇优美感人的文章呢?那除了文章内容外,还记得那报刊.杂志独有的多栏布局吗?  当我们希望将报刊.杂志中的阅读体验迁移到网页上时,最简单直接的方式就是采用 ...

  7. CSS3与页面布局学习笔记(六)——CSS3新特性(阴影、动画、渐变、变形( transform)、透明、伪元素等)

    一.阴影 1.1.文字阴影 text-shadow<length>①: 第1个长度值用来设置对象的阴影水平偏移值.可以为负值 <length>②: 第2个长度值用来设置对象的阴 ...

  8. CSS3 Gradient 渐变

    转载自:http://www.w3cplus.com/content/css3-gradient CSS3发布很久了,现在在国外的一些页面上常能看到他的身影,这让我羡慕已久,只可惜在国内为了兼容IE, ...

  9. CSS3文本温故

    1.CSS早期属性,分为三大类:字体.颜色和文本: 2.CSS文本类型有11个属性: 注:还有一个颜色属性:color,主要用来设置文本颜色 3.CSS3文本阴影属性:text-shadow语法:te ...

随机推荐

  1. [置顶] android关机闹钟设计思路

    1: 首先需要硬件支持,支持alarm中断触发开机,目前高通平台几乎都支持: 2:关机前需要在rtc-xxx.c中做到enable_irq_wake,和不disable alarm功能(默认开机后al ...

  2. Selenium WebDriver TestNg Maven Eclipse java 简单实例

    环境准备 前提条件Eclipse 已经安装过 TestNg ,Maven 插件 新建一个普通的java项目 点击右键 configure->convert to Maven Project 之后 ...

  3. OCA读书笔记(2) - 安装Oracle软件

    Objectives: •Describe your role as a database administrator (DBA) and explain typical tasks and tool ...

  4. ASIO攻破!!!----转

    from:http://www.cppblog.com/shanoa/archive/2009/06/26/88606.aspx 花了足足3天时间,外加1天心情休整,终于在第5天编写出了一个能运行的基 ...

  5. iebook 发布到网站 独家秘诀

    iebook 普通版只能产生exe文件,无法生成web公布的文件需要,因此,我们需要专业版. iebook2011版本并没有破解版,下面是一个iebook2010破解版: http://downloa ...

  6. perl的一些基本用法

    ReadLine support available (try 'install Bundle::CPAN')cpan>进入cpan的shell,好了,我为了安装spamassassin,需要安 ...

  7. linux 查看网络负载

    netstat -n | awk '/^tcp/ {++S[$NF]} END {for(a in S) print a, S[a]}' 前面的 netstat -n是netstat的命令,windo ...

  8. Cocos2d-x3.3RC0的Android编译Activity启动流程分析

    本文将从引擎源代码Jni分析Cocos2d-x3.3RC0的Android Activity的启动流程,以下是具体分析. 1.引擎源代码Jni.部分Java层和C++层代码分析 watermark/2 ...

  9. iOS高效开源类库

    因为iOS SDK相对比较底层,所以开发者就得受累多做一些体力活.不过幸运的是,有很多第三方的类库可以用来简化很多不必要的工作.笔者整理了一下在本人学习过程中用到的一些比较有用Objective-C开 ...

  10. Delphi经典网站收藏

    http://delphi.icm.edu.pl/   波兰的Delphi控件网站 http://dev.rdxx.com/Delphi/  国内的编程网站 非常全面 http://oracle.ch ...