css:

.box{

    width: 100px;

    overflow:hidden;

    white-space:nowrap;

    text-overflow:ellipsis;

}

white-space: 不换行。强制在一行显示。

text-overflow: 处理溢出的文本： 以省略号代替。

1

css处理文本溢出的更多相关文章

  1. CSS换行文本溢出显示省略号

    现代浏览器中使用css可以实现文本溢出,使用 text-overflow: ellipsis;在有些场景下没有效果,这个时候你需要检查应用的场景是是否是块元素,是否有确切的width. 如果是行内元素 ...

  2. css基础 -文本溢出 text-overflow:ellipsis;

    .className{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;} 外部结构如下是就失效了:(移动端) <a class ...

  3. CSS单行文本溢出显示省略号

    此为转载,原文地址 项目中常常有这种需要我们对溢出文本进行"..."显示的操作,单行多行的情况都有(具体几行得看设计师心情了),这篇随笔是我个人对这种情况解决办法的归纳,欢迎各路英 ...

  4. css实现文本溢出用...显示

    文本溢出省略号显示,要实现这个必须 要有四个条件: 1.须有容器宽度:width:value 2.强制文本在一行内显示:white-space:nowrap: 3.溢出内容隐藏:overflow:hi ...

  5. css实现文本溢出显示...

    在网页中显示文字内容时,经常会碰到文字内容特别长的情况,那么这个时候为了使网页看起来比较美观和简洁,会对内容进行处理.下面我们就来看一看,如何使用css来对文字溢出部分增加.... 首先来看第一种情况 ...

  6. css实现文本溢出显示省略号

    看到很多网站上的文章列表只显示一部分,之后就是一个阅读全文链接,或者是以一个省略号结尾.今天就说说单行文本,多行文本溢出时怎么显示省略号? 单行 overflow: hidden; white-spa ...

  7. CSS换行文本溢出显示省略号，多行

    首先,div部分 <body> <div>多行的显示该如何解决呢,后面经过一番google后,我找到了chrome的一个API可以解决上面提到的需求-webkit-line-c ...

  8. CSS之文本溢出隐藏，不定宽高元素垂直水平居中、禁止页面文本复制

    1.如何让不固定元素宽高的元素垂直水平居中 .center { position: absolute; top: 50%; left: 50%; background-color: #000; wid ...

  9. css单行文本与多行溢出文本的省略号问题

    在文字布局和代码编写过程中遇到文本溢出是常有的事,下面总结一下对于单行文本溢出和多行文本溢出省略号的处理. 一.单行文本省略号 <p class="text1"> 这是 ...

随机推荐

  1. u3d不显示阴影的处理方法

    正常情况下都会显示的,如果没有显示,尝试以下几种方案: 1)缩小模型看一看 2)旋转灯光试试,看是否有阴影 3)检查阴影设置 菜单栏Edit –> Project Settings –> ...

  2. BLEU (Bilingual Evaluation Understudy)

    什么是BLEU? BLEU (Bilingual Evaluation Understudy) is an algorithm for evaluating the quality of text w ...

  3. FPGA基础之逻辑单元（LE or LC）的基本结构

    原帖地址: https://blog.csdn.net/a8039974/article/details/51706906/ 逻辑单元在FPGA器件内部,是完成用户逻辑的最小单元.逻辑单元在ALTER ...

  4. 基于springboot整合的rabbitmq

    技术:springboot1.5.2 + maven3.0.5 + rabbitmq3.7.13 + jdk1.8   概述 RabbitMQ是对高级消息队列协议(Advanced Message Q ...

  5. Docker+Nginx+Keepalived实现架构高可用

    一.背景 通过keepalived实现nginx高可用,由于在家不想弄多台主机来搞,所以将运行环境用docker封装来模拟跨主机 docker基础镜像:centos 说之前,简单介绍一下: Keepa ...

  6. RobotFrameWork编写接口测试及如何断言

    1. 前言 本篇是第一系列(Http接口自动化)的第五课程,如果对系列课程大纲不清楚的,可以查看<RobotFramework系列免费课程-开课了~>. 前面我们介绍了,在真正实施前,需先 ...

  7. 雅克比迭代算法(Jacobi Iterative Methods) -- [ mpi , c++]

    雅克比迭代,一般用来对线性方程组,进行求解.形如: \(a_{11}*x_{1} + a_{12}*x_{2} + a_{13}*x_{3} = b_{1}\) \(a_{21}*x_{1} + a_ ...

  8. simHash 简介以及 java 实现

    传统的 hash 算法只负责将原始内容尽量均匀随机地映射为一个签名值,原理上相当于伪随机数产生算法.产生的两个签名,如果相等,说明原始内容在一定概 率 下是相等的:如果不相等,除了说明原始内容不相等外 ...

  9. Unity应用架构设计(3)——构建View和ViewModel的生命周期

    对于一个View而言,本质上是一个MonoBehaviour.它本身就具备生命周期这个概念,比如,Awake,Start,Update,OnDestory等.这些是非常好的方法,可以让开发者在各个阶段 ...

  10. MySQL优化器 --- index_merge

    [背景] 对于关系数据库中的一张表,通常来说数据页面的总大小要比较某一个索引占用的页面要大的多(上面说的索引是不包涵主键索引的); 更进一步我们可以推导出,如果我们通过读索引就能解决问题,那么它相比读 ...