1     width: 100px;

2    background-color: pink;
　　　　//一下内容为设置文字换行 及 只显示两行，超出显示省略号

3    text-overflow: -o-ellipsis-lastline;

4    overflow: hidden;

5    text-overflow: ellipsis;

6    display: -webkit-box;

7    -webkit-line-clamp: 2;

8    line-clamp: 2;

9    -webkit-box-orient: vertical;

显示两行文字，超出显示省略号 css的更多相关文章

  1. CSS div内文字显示两行，超出部分省略号显示

    1. 概述 1.1 说明 在项目过程中,有时候需要控制div内文字最多显示两行,超出的使用省略号进行处理.使用识别码/前缀-webkit进行处理可直接得到相应效果. 1.1 -webkit WebKi ...

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

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

  3. CSS控制文字显示一行，超出显示省略号

    这几天在项目需求里面遇到了很多之前没做过的需求,也慢慢更加认识到了css的强大,是真的强大.以后会把自己技术调研的东西都写出来,哪怕只是一点点或者很小的点,重在学习. “CSS控制文字显示一行,超出显 ...

  4. 用户界面样式（cursor，resize，vertical-align，outline，文字超出显示省略号）

    1. 鼠标样式 cursor default: 小白(箭头)默认 pointer:小手 move:移动 text:文本 not-allowed:禁止 2. 轮廓线(表单外发光)outline 给表单添 ...

  5. bootstrap3.0 模态框显示的文字超出怎么办

    版本:bootstrap3.3 模态框文字超出 解决方案: 在html中控制自动换行   其实只要在表格控制中添加一句<div style="word-break:break-all& ...

  6. jquery限定文字超出用省略号

    都知道用css3可以做到一行超出显示省略号,但多行的用css3很麻烦还要考虑兼容,今天用jquery判断字数来限制出现省略号 $(".ftlt_lt_wzne").each(fun ...

  7. 【CSS】文字超出显示省略号&连续字符换行

    方法1.多行控制(css3) .text { width: 100%; word-break: break-all; display: -webkit-box; -webkit-line-clamp: ...

  8. CSS解决文字超出显示省略号问题

    超出一行 white-space: nowrap; overflow: hidden; text-overflow: ellipsis; 超出多行 overflow: hidden; text-ove ...

  9. css文字超出显示省略号

    单号: white-space:nowrap; overflow:hidden; text-overflow:ellipsis; 多行: word-break: break-all; text-ove ...

  10. 微信小程序 实现多行文字 超出部分省略号显示

    在开发小程序: 澳买 的 时候 遇到一个棘手的问题: 当搜索澳洲产品,获取产品列表的时候,有时候产品的名称翻译成中文特别长 我们不能全部在有限的列表里面把产品名都显示出来,这样格式不好控制,显示 出来 ...

随机推荐

  1. [TJOI2007]书架

    题目 网上搜 分析 我们可以认为插入一本书是在树中第 \(k\) 的位置进行插入操作 其中 \(k\) 为这本放入书架后的位置 考虑 \(fhq-treap\) 实现 我们将书编号为 \([0,n-1 ...

  2. 分布式任务调度平台XXL-JOB安装

    安装xxl-job-admin 1.拉取镜像 #拉取镜像 docker pull xuxueli/xxl-job-admin:2.3.0 #新建挂载目录 mkdir /usr/local/xxl-jo ...

  3. js手动触发页面元素点击事件，自定义点击事件模拟点击

    // initEvent事件已经弃用1. 创建MouseEvents事件const clickEvent = document.createEvent('MouseEvents')2. 初始化点击事件 ...

  4. typescript - 学习档案

    由于内容繁多,使用掘金来记录此笔记,方便索引跟随!未完待续~~~ 地址如下: https://juejin.cn/post/6899350420541014030/#heading-20

  5. C# 游戏雏形 人物地图双重移动

    1. 设计出发点 准备做一个旅游短视频,想实现一个小人或汽车在百度地图上按指定路线移动的效果,把之前自己写的代码拿出来,修改完成. 主要修改内容: (1)实现了人物地图双移动.即如果人物向屏幕中间移动 ...

  6. 测开-面试题-MySQL

    1 增删改查的关键字分别是什么? 答: insert into \ replace into.delete.update.select 2 内连接和外连接的区别? 答: (1)内连接,只会展示与两表关 ...

  7. Column count doesn't match value count at row 1存储的数据与数据库表的字段类型定义不相匹配

    一.造成这个原因可能是一个关于创建json数据类型的mysql表格插入的一个报错提示: 26行为错误示范:27是正确书写规范.

  8. 客户端发送信息给服务器以及服务器接收客户端发来的信息（socket）

    服务器端: using System; using System.Collections.Generic; using System.ComponentModel; using System.Data ...

  9. uniapp使用百度地图

    要使用第三方百度地图,首先要去百度地图官方申请一个密钥,之后引入百度地图的API文件,参考使用文档即可开发使用.而在uniapp中是没法直接引入百度地图API文件的,我们要结合uniapp中的web- ...

  10. 【Linux】ArchLinux 使用之旅

    主要参考以下两个链接进行,安装系统和安装桌面环境. 以官方Wiki的方式安装ArchLinux | viseator's blog ArchLinux安装后的必须配置与图形界面安装教程 | visea ...