做这个省略的问题，突然发现显示省略号是有中英文区分的

我做两行的时候用的是以下代码，在是中文的情况下是么得问题，到了英文下发现不起作用了

            width: 250px;

            overflow: hidden;

            text-overflow: ellipsis;

            display: -webkit-box;

            -webkit-line-clamp: 2;　　//这个代表你要在几行显示省略号

            -webkit-box-orient: vertical;

原来是得加上　　word-break: break-all; 　　加上这个的话 在中英文下都可以正常使用

 注意：只兼容

Chrome内核浏览器

css文字两行或者几行显示省略号的更多相关文章

  1. 【css】 文本超出2行显示省略号

    首先,要知道css的三条属性. overflow:hidden; //超出的文本隐藏 text-overflow:ellipsis; //溢出用省略号显示 white-space:nowrap; // ...

  2. JS控制文字只显示两行，超出部分显示省略号

    由于使用css控制文字只显示多行,超出部分显示省略号,存在一定的兼容性问题,所以总结了一下网上一些大咖使用js实现控制行数的解决方案. 第一步:依次引入jquery.js+jquery.ellipsi ...

  3. css多行显示省略号

    首先说css多行显示省略号和单行文本省略号: 我们知道,单行显示省略号时,我们首先需要设置容器的宽度width:value(具体的值),然后强制文本在一行内显示,即white-spacing:nowr ...

  4. html文字两行后，就用省略号代替剩下的

    html文字两行后,就用省略号代替剩下的 一.总结 一句话总结: 实现原理很简单,将box的高度设置为行高的两倍,超出之后隐藏,这样就只有两行了,然后再用after属性绝对定位在第二行后面加几个点 . ...

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

    单行文本 overflow: hidden; text-overflow:ellipsis; white-space: nowrap; 多行文本溢出显示省略号: <style type=&quo ...

  6. css--两行显示省略号兼容火狐浏览器

    css--两行显示省略号兼容火狐浏览器 正常写法: .ellipse1{overflow: hidden;white-space: nowrap;text-overflow: ellipsis;} . ...

  7. CSS和JS实现文本溢出显示省略号

    本文记录实现文本溢出显示省略号的几种方式. 单行文本 三行CSS代码实现: overflow: hidden; // 文本溢出隐藏 text-overflow: ellipsis; // 显示省略号 ...

  8. CSS控制文本超出指定宽度显示省略号和文本不换行

    一般的文字截断(适用于内联与块): .text-overflow { display:block;/*内联对象需加 */ width:31em;/* 何问起 hovertree.com */ word ...

  9. 布局常见问题之css实现多行文本溢出显示省略号(…)全攻略

    省略号在ie中可以使用text-overflow:ellipsis了,但有很多的浏览器都需要固定宽度了,同时ff这些浏览器并不支持text-overflow:ellipsis设置了,下文来给各位整理一 ...

随机推荐

  1. 2019 UCloudjava面试笔试题 （含面试题解析）

      本人5年开发经验.18年年底开始跑路找工作,在互联网寒冬下成功拿到阿里巴巴.今日头条.UCloud等公司offer,岗位是Java后端开发,因为发展原因最终选择去了UCloud,入职一年时间了,也 ...

  2. 【开发笔记】- SSM使用velocity模板语言

    1.在pom.xml里添加velocity模板语言支持的依赖 <!-- velocity模板语言支持包 --> <dependency> <groupId>org. ...

  3. 报错The "chunk" argument must be one of type string or Buffer. Received type object

    报错内容: TypeError [ERR_INVALID_ARG_TYPE]: The "chunk" argument must be one of type string or ...

  4. php正则表达式中preg_match_all函数的详解

    php正则表达式中的函数我们之前为大家结果一个preg_match函数,相信大伙对此有所了解,那么php正则表达式中preg_match_all函数的具体使用是如何的呢?今天我们就带大家了解php正则 ...

  5. 爬虫入门urlib,urlib2的基本使用和进阶

    python2中的urlib和urlib2 1.分分钟扒一个网页下来 怎样扒网页呢?其实就是根据URL来获取它的网页信息,虽然我们在浏览器中看到的是一幅幅优美的画面,但是其实是由浏览器解释才呈现出来的 ...

  6. centos 宝塔 使用命令行快速导入数据库sql

    先将sql文件上传到服务器,例如上传到www文件夹 然后打开命令行工具 输入 mysql -u 数据库用户名 -p 然后复制密码进去 然后输入 use 数据库名 回车 然后输入 source /www ...

  7. 数据库开发-Django ORM的一对多查询

    数据库开发-Django ORM的一对多查询 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.联合主键问题 CREATE TABLE `employees` ( `emp_no` ...

  8. MySQL/MariaDB数据库的主从复制

     MySQL/MariaDB数据库的主从复制  作者:尹正杰  版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.MySQL复制概述 1>.传统扩展方式 垂直扩展(也叫向上扩展,Sacle ...

  9. Centos7安装配置Nginx_笔记

    从Nginx官方网站下载稳定的主要分支版本.然后解压开来. 在Linux中需要使用编译工具编译安装Nginx. 首先安装“Development Tools”工具,包含了所有编译Nginx所需的依赖工 ...

  10. geopy 在python中的使用

    https://blog.csdn.net/learn_tech/article/details/80756788 2018年06月21日 10:35:52 learn_tech 阅读数:1182   ...