【要求】：如何用css实现字符串截断，超出约定长度后用缩略符...代替？

  ♪ 答：

<html>

<head>

    <meta charset="UTF-8">

    <title>用 css 实现字符串截断</title>

    <style>

        div {

            width: 300px;

            overflow: hidden;   /*规定当内容溢出元素框时发生的事情*/

            white-space: nowrap;    /*设置如何处理元素内的空白。规定在文本中不进行换行*/

            text-overflow: ellipsis;    /*规定当文本溢出包含元素时发生的事情*/

        }

    </style>

</head>

<body>

    <div>轻轻松松制作div+css截取字符段在规定长度，超出部分用...代替！</div>

</body>

</html>

☸ 属性参考：white-space、text-overflow

用 CSS 实现字符串截断的更多相关文章

  1. js中文输入法字符串截断

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. C++常用的string字符串截断函数

    C++中经常会用到标准库函数库(STL)的string字符串类,跟其他语言的字符串类相比有所缺陷.这里就分享下我经常用到的两个字符串截断函数: #include <iostream> #i ...

  3. CSS和字符串实现三角形

    听说是百度校招的题目,就写了一下 <!doctype html> <html> <head> <meta charset="utf-8"& ...

  4. 小tips：JS/CSS实现字符串单词首字母大写

    css实现: text-transform:capitalize; JS代码一: String.prototype.firstUpperCase = function(){ return this.r ...

  5. 【python】含中文字符串截断

    对于含多字节的字符串,进行截断的时候,要判断截断处是几字节字符,不能将多字节从中分割,避免截断后乱码 下面给出utf8和gb18030上的实现, 用任何一种都可以,可以先进行转码,用encode, d ...

  6. css颜色字符串转换, 字符串转化为驼峰形式

    * 将 rgb 颜色字符串转换为十六进制的形式,如 rgb(255, 255, 255) 转为 #ffffff1. rgb 中每个 , 后面的空格数量不固定2. 十六进制表达式使用六位小写字母3. 如 ...

  7. CSS截取字符串，额外的文本显示以省略号

    最近的诀窍css还有这么叼炸天的侧~~~ 善待似论坛页面,头像70px,但username不限啊,English中国能够.你说如果他采取"我的名字是这么长啊.你该怎么办呢".那老和 ...

  8. Css 截取字符串长度

    .shortNameShow{ overflow:hidden; text-overflow:ellipsis; -o-text-overflow:ellipsis; white-space:nowr ...

  9. Oracle字符串截断

    字段.SUBSTR(string,start_position,[length]) 求子字符串,返回字符串解释:string 元字符串, start_position 开始位置(从0开始), leng ...

随机推荐

  1. JDE函数--GetUDC（B函数）

    GetUDC使用方式:

  2. [转]玩转Google开源C++单元测试框架Google Test系列

    gtest的官方网站是: http://code.google.com/p/googletest/ 从官方的使用文档里,你几乎可以获得你想要的所有东西 http://code.google.com/p ...

  3. git常用语法

    git笔记  1.     获取项目(克隆):     Git repository:                       git clone -b develop ssh://git@68. ...

  4. Windows系统安装时间

    http://www.45it.com/windowszh/201206/30693.htm 修改系统安装时间 开始" - "运行" - 输入"regedit& ...

  5. HDU 5451 广义斐波那契数列

    这道题目可以先转化: 令f(1) = 5+2√6 f(2) = f(1)*(5+2√6) ... f(n) = f(n-1)*(5+2√6) f(n) = f(n-1)*(10-(5-2√6)) = ...

  6. Web体系=资源+URI+表示

    概述 Web有三个核心概念:资源(Resource).URI(UniformResource Identifer,统一资源标识符).表示(Representation).一个资源由一个URI进行标识. ...

  7. as3基础知识

    在AS3中,值类型数据(简单类型:Boolean.int.Number.String.uint)和引用类型数据(复杂类型)都是 对象,所以这两种类型对象存储的都是引用.但是,对应值类型数据,是一种不变 ...

  8. OpenCV坐标体系的初步认识

    实验基础 本次实验通过一个简短的例子,主要来说明下面4个问题: 1. 坐标体系中的零点坐标为图片的左上角,X轴为图像矩形的上面那条水平线:Y轴为图像矩形左边的那条垂直线.该坐标体系在诸如结构体Mat, ...

  9. RAD,V模型

    介绍: RAD(Rap Application Developmen快速应用开发t)模型是软件开发过程中的一个重要模型,由于模型构图类似字母V,所以又称为软件开发的V模型.它通过开发和测试同时进行的方 ...

  10. iOS中Block使用探索

    Block介绍 Block在ios 4.0之后加入,并大量使用在新的ios api中.block是一个匿名的代码块,可以传递给其他对象的参数,并得到返回值.从本质上讲,block同其他普通的变量类似, ...