之前写代码的时候遇到一个问题,就是用了下面这段css代码来让文字超出范围隐藏并显示省略号。

    overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: ;
-webkit-box-orient: vertical;

然鹅本地运行的时候是没有问题的,但是build之后发现失效了。仔细一看是 -webkit-box-orient: vertical; 没有起效。
最后各种修改之后发现应该是webpack的锅
解决方案是改成下面这样

    overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: ;
/*! autoprefixer: off */
-webkit-box-orient: vertical;
/* autoprefixer: on */

关于H5 移动端css 文本超出时省略号 失效的问题的更多相关文章

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

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

  2. css文本超出部分省略号&CSS强制换行总结

    word-break:break-all单词截断自动换行 word-break:break-all 例如div宽200px,它的内容就会到200px自动换行,如果该行末端有个英文单词很长(congra ...

  3. CSS文本超出用省略号代替的方法

    { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

  4. 文本超出显示省略号/数字英文字母折行有关css 属性/显示两行,第二行省略号显示css方法

    文本超出显示省略号: 定容器宽度 overflow: hidden; text-overflow: ellipsis; 文本超出显示省略号 white-space:nowrap;  强制文本不换行 折 ...

  5. CSS 文本溢出时显示省略标记

    如标题所示... <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.o ...

  6. css文本超出省略号

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

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

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

  8. 文本超出显示省略号CSS

    单行超出显示省略号 display: block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; 多行超出显示省略号 1.普 ...

  9. css 文本超出容器长度后自动省略的方法!

    我们在给用户显示文本内容的时候,往往需要避免文本内容超出容器宽度,防止换行溢出,小弟在网上找了下发现网上的实现仅仅只是实现了用 ...省略了的功能! 而并没有获取光标提示的功能,所有小弟就结合网上的代 ...

随机推荐

  1. PHP DES解密 对应Java SHA1PRNG方式加密

    背景及问题 背景:在和外部系统通过HTTP方式跳转时, 为保障传输参数安全性, 采用AES 加密参数. 关于对称加密中 AES, DES, CBC, ECB, PKCS5Padding 概念可参考ht ...

  2. Windows下etc文件夹

    etc etcetera[ɛtsɛtərə]缩写 等等的意思 放置一些其他文件

  3. csharp:Google TTS API text to speech

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...

  4. Scrapy爬虫requests

    requests 模块 模块的由来: 浏览器可以浏览网站, 是由于浏览器发送了requests , 各种请求.打开一个网站可能有几十到几百个请求. 从而服务器端会反馈各种因应不同请求生成的数据. 我们 ...

  5. Android--Otto事件总线 -- 组件之间通讯框架使用 --模式解析

    前言:Otto事件总线 -- 组件之间通讯框架 对于之前的情况activity之间或者fragment之间等跳转传值一般都是用bundle.intent等,从activityA --- activit ...

  6. SiP封装成超越摩尔定律的要塞,日月光/安靠/长电科技谁将赢取IC封装的未来

    来源:EEFOCUS 进入2017年,摩尔定律的脚步愈加沉重,"摩尔定律已死"的言论笼罩着整个半导体行业,超越摩尔定律发展的想法在半导体从业人员的脑海里更清晰了.在这样的大环境下, ...

  7. PHP通过header和meta实现页面编码声明

    一.使用方式: <META http-equiv=”content-type” content=”text/html; charset=xxx”> header(“content-type ...

  8. ORACLE 角色授权

    直接例子: 1.CREATE USER 用户名 identified by 密码 default tablespace 表空间名;GRANT CONNECT TO 用户名; GRANT RESOURC ...

  9. UnicodeDecodeError: 'utf8' codec can't decode byte in position invalid start byte

    在scrapy项目中,由于编码问题,下载的网页中中文都是utf-8编码,在Pipeline.py中方法process_item将结果保存到数据库中时,提示UnicodeDecodeError: 'ut ...

  10. 爬虫入门之Scrapy框架基础rule与LinkExtractors(十一)

    1 parse()方法的工作机制: 1. 因为使用的yield,而不是return.parse函数将会被当做一个生成器使用.scrapy会逐一获取parse方法中生成的结果,并判断该结果是一个什么样的 ...