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. java解决手机上传竖拍照片旋转90\180\270度问题

    <dependency> <groupId>com.drewnoakes</groupId> <artifactId>metadata-extracto ...

  2. 通过Tag标签回退版本修复bug

    tag是对历史一个提交id的引用,如果理解这句话就明白了使用git checkout tag即可切换到指定tag,例如:git checkout v0.1.0 切换到tag历史记录会处在分离头指针状态 ...

  3. Mac PD 虚拟机 鼠标双击 输入 "c" 解决

    Mac PD 虚拟机 鼠标双击 输入 "c" 解决 特么的, 是屏幕取词软件引起的.. 关闭就好了.

  4. java 根据系统日期获取前一天、后一天时间(根据初始日期推算出期望（向前/向后）日期)

      1.情景展示  java 根据系统当前日期获取前一天日期.后一天日期,或者根据初始日期推算出期望(向前/向后)日期. 2.解决方案 导包 import java.text.ParseExcepti ...

  5. CMD 命令2

    cd  %~dp0 切换到当前脚本所有目录 批处理常用命令总结 - 批处理命令简介 目录 echo 打开回显或关闭请求回显功能,或显示消息.如果没有任何参数,echo 命令将显示当前回显设置. ech ...

  6. centos7设置服务为开机自启动（以crond.serivce为例）

    本文转自:https://blog.51cto.com/mrxiong2017/2084790 一.设置crond.serivice服务为开机自启动 步骤1:查看crond.serivce服务的自启动 ...

  7. AI创业的技术方案选择

    观察了许多初创公司技术方案的选择,我总结基本遵循8个字:快速灵活,物美价廉.我们也应该根据自身实际情况,跳出束缚与时俱进,选择智能互联网时代最有力的技术和工具. 基础编程语言 候选者:C#/C++/P ...

  8. 怎么让Windows2012和Windows2008多用户同时远程---经过测试有效

    链接地址:https://jingyan.baidu.com/article/cd4c2979f19765756e6e60ec.html 怎么让Windows2012和Windows2008多用户同时 ...

  9. 【iCore4 双核心板_ARM】例程三十八：DSP MATH库测试

    实验现象: 核心代码: int main(void) { /* USER CODE BEGIN 1 */ int i,j; int res; ]; ; /* USER CODE END 1 */ /* ...

  10. 解决“Comparison method violates its general contract!”

    The ONE跑MaxProp.Prophet可能(取决于你JDK的版本)会报“java.lang.IllegalArgumentException: Comparison method violat ...