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

　　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. Ruby中星号打包解包操作

    Ruby中可以使用一个星号*和两个星号**完成一些打包.解包操作,它们称为splat操作符: 一个星号:以数组为依据进行打包解包(参考文章) 两个星号:以hash为依据进行打包解包(参考文章) 两个星 ...

  2. 网站报"组策略阻止了这个程序。要获取详细信息，请与系统管理员联系。"错误。

    今天将一个测试的网站发布到阿里云虚拟主机后,访问网站报“组策略阻止了这个程序.要获取详细信息,请与系统管理员联系.”错误.如下: 但是这个错误在本地调试时是没有的. 经过调查,原来罪魁祸首是 Micr ...

  3. Python菜鸟文本处理4种方法

    自从认识了python这门语言,所有的事情好像变得容易了,作为小白,逗汁儿今天就为大家总结一下python的文本处理的一些小方法. 话不多说,代码撸起来. python大小写字符互换 在进行大小写互换 ...

  4. PlayJava Day015

    今日所学: /* 2019.08.19开始学习,此为补档. */ StringBuffer 定义: 可变字符序列 - 线程安全的 作用:基本与String相同,也是用于描述字符串 与String的区别 ...

  5. IDEA中新建SpringBoot项目时提示:Artifact contains illegal characters

    场景 一步一步教你在IEDA中快速搭建SpringBoot项目: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/87688277 ...

  6. Add a Simple Action using an Attribute 使用特性添加简单按钮

    In the previous Add a Simple Action lesson, you learned how to add an Action by implementing the Vie ...

  7. textarea中文本高亮选中

    最近在实现原文/译文句段高亮对比显示,和有道翻译类似,如下图所示: 最初的解决方案是采用富文本编辑器,把所有句段信息都用HTML标签包裹,操作空间比较大,页面上需要的功能几乎都可以实现,但是由此带来了 ...

  8. 微信小程序新服务消息推送 —— 订阅消息

    微信团队前不久公测了「订阅消息」,原有的小程序模板消息接口将于 2020 年 1 月 10 日下线,届时将无法发送模板消息.「订阅消息」将完全替代「模板消息」,这两天得空测试了一波. 1.下发权限机制 ...

  9. 23种设计模式之Builder设计模式

    概述 建造者模式(Builder Pattern),是创造性模式之一,Builder 模式的目的则是为了将对象的构建与展示分离.Builder 模式是一步一步创建一个复杂对象的创建型模式,它允许用户在 ...

  10. oracle表空间设置自动扩展

    开启自动扩展功能语法: alter database datafile '对应的数据文件路径信息' autoextend on; 关闭自动扩展功能语法: alter database datafile ...