以前我在面试中遇到过这个问题,当时没答上来,现在回答一下:

  1.设置三个属性:

    overflow:hidden   (超出部分隐藏)

white-space:nowrap    (强制不换行)

text-overflow:ellipsis     (文本超出用三个省略号代替)

  

  2.代码部分截图:

  

  3.最终效果:

  

css文本超出部分用省略号表示的更多相关文章

  1. CSS——文本超出隐藏显示省略号

    文本超出隐藏显示省略号 1.单行文本的溢出显示省略号 overflow: hidden; text-overflow:ellipsis; white-space: nowrap; // overflo ...

  2. css文本超出隐藏显示省略号

    p style="width: 300px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;"> 如 ...

  3. css 文本超出范围显示省略号

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. css文本超出省略号

    终于完成了项目了,今天我就分享自己在项目中比较实用的一些功能的实现,第一个就是纯css文本超出省略号 /* 文本单行超出省略号 */ .textels { overflow: hidden; text ...

  5. 不值一提,却又不得不提的“CSS文本超出部分省略号代替”

    偶然看到一篇类似css技巧与经验总结的文章,其中有一部分非常熟悉,那就是“css控制元素内文本超出部分使用省略号代替”,一般实际工作中, 很多产品经理会对页面UI有这样的要求.还记得,第一次做这个功能 ...

  6. css文字超出自动显示省略号

    只针对单行文本有效: 01.针对块状元素 ul li{ width: 180px; text-overflow: ellipsis; white-space: nowrap;/*禁止自动换行*/ ov ...

  7. css兼容大部分浏览器的文本超出部分显示省略号

    css之字体多行省略(兼容大部分浏览器) 字体单行显示省略号 <style> .box1{ width: 500px; height: 1.5em; overflow: hidden; t ...

  8. css文本溢出隐藏显示省略号(单行+多行)

    文本超出若干行就换行,这个功能几乎每个文本浏览网站都会用到,实现它的办法也有很多,今天简单的介绍一下实现它的方法.  一. 单行文本不换行,并将超出文本隐藏 .box-content{     ove ...

  9. css/js 超出部分显示省略号

    1.js方法 function cutString(str, len) { //length属性读出来的汉字长度为1 if (str.length * 2 <= len) { return st ...

随机推荐

  1. tensorflow convert_variables_to_constants

    在使用tf.train.Saver函数保存模型文件的时候,是保存所有的参数信息,而有些时候我们并不需要所有的参数信息.我们只需要知道神经网络的输入层经过前向传播计算得到输出层即可,所以在保存的时候,我 ...

  2. ES&IK环境搭建

    本来打算docker安装es,和腾讯云上的服务器相比,一台赤裸裸的本地机,甚至连很多基础的指令都没有,还花样各种报错,对于我这种新手来说简直了,百度啊cddn啊终于整出来了,记录一下: 一:安装依赖 ...

  3. 指定节点滚动到屏幕中间的js

    父节点的class是slimScrollDiv 子节点的class是fa-warning 执行这个js document.getElementsByClassName("slimScroll ...

  4. Python中7个不一样的代码写法

    打印index 对于一个列表,或者说一个序列我们经常需要打印它的index,一般传统的做法或者说比较low的写法: 更优雅的写法是多用enumerate 两个序列的循环 我们会经常对两个序列进行计算或 ...

  5. springcloud Springboot vue.js Activiti6 前后分离 跨域 工作流 集成代码生成器 shiro权限

    1.代码生成器: [正反双向](单表.主表.明细表.树形表,快速开发利器)freemaker模版技术 ,0个代码不用写,生成完整的一个模块,带页面.建表sql脚本.处理类.service等完整模块2. ...

  6. JS基础语法---函数的其他定义方式

    函数的其他定义方式 函数声明 函数表达式:把一个函数给一个变量,此时形成了函数表达式 函数调用 函数的自调用   命名函数:函数如果有名字,就是命名函数 匿名函数:函数如果没有名字,就是匿名函数   ...

  7. 零售行业下MongoDB在产品目录系统、库存系统、个性推荐系统中的应用【转载】

    Retail Reference Architecture Part 1: Building a Flexible, Searchable, Low-Latency Product Catalog P ...

  8. 如何在文本编辑器中实现时间复杂度O(n/m)的搜索功能? BM算法

    //字符串匹配 public class StringCmp { //约定:A主串长 n ,B模式串 长m.要求:在A串中找到B串匹配的下标 //BM算法:从B串和A串尾部开始比较,希望一次将B串向后 ...

  9. Vue动态设置Dom元素宽高

    需求: slider侧边栏是宽度是动态的,使用jquery可以操作dom元素,设置宽高,但vue是避免操作dom的 <template> <div class="slide ...

  10. SpringCloud学习笔记(二、SpringCloud Config)

    目录: 配置中心简介 SpringCloud Config服务端 SpringCloud Config客户端 动态配置属性bean 一些补充(源码分析):Spring事件监听.健康检查health() ...