<div class="title">当对象内文本溢出时显示省略标记</div>

这是一个例子,其实我们只需要显示如下长度:

css实现网页中文字过长截取...

title class应该这样写:

.title{ width:300px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

说明:

1、宽度一定要设置,可以根据实际需求调整。

2、white-space:nowrap是禁止文字折行。

3、text-overflow表示当文本溢出时是否显示省略标记,有两个值:

clip:不显示省略标记(...),而是简单的裁切。
ellipsis:当对象内文本溢出时显示省略标记(...)

4、overflow:hidden表示溢出内容为隐藏。

css实现文字过长显示省略号的方法的更多相关文章

  1. CSS样式 解决文字过长显示省略号问题

    一.CSS样式 解决文字过长显示省略号问题 1.一般样式 一般 css 样式,当宽度不够时,可能会出现换行的效果.这样的效果在某些时候肯定是不行的,可以修改 css 样式来解决这个问题. <!D ...

  2. css 控制文字超出部分显示省略号

    该文章转自:http://www.daqianduan.com/6179.html 如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽 ...

  3. css 控制文字超出时显示省略号

    不多说,直接看代码吧: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> & ...

  4. CSS控制 文字超出部分显示省略号

    实现单行文本的溢出显示省略号, (需要加宽度width属来兼容部分浏览) <p style="width: 100px;overflow: hidden;white-space: no ...

  5. css 实现文字过长变成省略号(包含单行的and多行的)

    单行的比较简单  但是必须条件同时满足 <DIV STYLE="width: 120px; height: 50px; border: 1px solid blue;overflow: ...

  6. css设置文字多余部分显示省略号

    如果只显示一行,则可以使用以下方法: overflow: hidden; text-overflow:ellipsis; white-space: nowrap; 如果需要显示多行,在需要设置的元素s ...

  7. css实现文字内容超出显示省略号

    white-space: nowrap; /* 内容超出容器宽度时强制不换行 */ overflow: hidden; /* 内容超出容器时隐藏超出部分 */ text-overflow: ellip ...

  8. css对于文字过长加省略号

    overflow: hiddentext-overflow: ellipsiswhite-space: nowrap

  9. css设置文字超出部分显示省略号。。。

    兼容IE/Firefox/Chrome display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;

随机推荐

  1. Mysql-SQL优化-子查询替代LEFT JOIN

    表A:批次信息表, 表B:实际批次明细表, Mysql版本:5.6.36 两表之间的数据体量差异:表B是表A的10000倍. 经过结转,表B通常保留 1千5百万数据.表A就是1千多条数据. 计算近24 ...

  2. java intellij 工具的简单用法

    一.目录结构 1.新建项目(Empty Project) ->  新建module(可以有多个) => 出来src文件夹 -> 在src文件夹中新建package -> 在pa ...

  3. selenium chrome headless无界面引擎

    注意:PhantomJS已被舍弃 chrome headless 在打开浏览器之前添加参数 import time import sys from selenium import webdriver ...

  4. Linux开发环境准备(一)

    工欲善其事,必先利其器 今天是腊月廿九,明天春节.我想着在今天对2019年所学到的东西做下总结. 从操作系统的安全性,系统代码是否开源,对开发人员的友好性,以及学习和工作的需求,我最终选择了Linux ...

  5. 03--java--DOS编译运行输出Java,Hi!

    lalala.... 1.新建文本文档,将扩展名改成.java为后缀的文件 2.利用记事本打开.java文件,进行编写保存 3.启动dos窗口,进入到.java文件所在目录中 4.使用"ja ...

  6. UML--->活动图梳理

    活动图梳理 活动图 概述 活动图是UML用于对系统的动态行为建模的另一种常用工具,它描述活动的顺序,展现从一个活动到另一个活动的控制流,常常用于描述业务过程和并行处理过程,活动图在本质上是一种流程图. ...

  7. SpringCloud与微服务Ⅸ --- Zuul路由网关

    一.Zool是什么 Zuul包含了对请求路由和过滤两个最主要的功能: 其中路由功能负责将外部请求转发到具体的微服务实例上,是实现外部访问统一入口的基础而过滤器功能则负责对请求的处理过程进行干预,是实现 ...

  8. C++ 对TXT 的串并行读写

    任务说明:有36篇文档,现在要读入,并统计词频,字典长度25,希望能够比较串并行读写操作的时间差距. 串行读入并统计词频 // LoadDocsInUbuntu.cpp // #include < ...

  9. AcWing 786.第k个数

    AcWing 786.第k个数 题目描述 给定一个长度为n的整数数列,以及一个整数k,请用快速选择算法求出数列的第k小的数是多少. 输入格式 第一行包含两个整数 n 和 k. 第二行包含 n 个整数( ...

  10. Boyer-Moore 算法 Leetcode169

    Boyer-Moore 算法 Leetcode169 一.题目 169. 多数元素 给定一个大小为 n 的数组,找到其中的多数元素.多数元素是指在数组中出现次数大于 ⌊ n/2 ⌋ 的元素. 你可以假 ...