文本超出显示三个点一般分两种情况

  一,单行文本超出隐藏

   overflow:hidden;

   text-overflow:ellipsis;

   white-space:nowrap;

  二,多行文本超出隐藏

    text-overflow: -o-ellipsis-lastline;

    overflow: hidden;

    text-overflow: ellipsis;

    display: -webkit-box;

    -webkit-line-clamp: 3; //行数需设置

    line-clamp: 3;

    -webkit-box-orient: vertical;

单行设置宽 多行设置宽高不然不会生效

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实现不换行/自动换行/文本超出隐藏显示省略号

    在写页面的时候,我们经常会需要用到关于文本的换行,强制换行以及显示几行超过显示省略号等,今天我们就对这些问题来做个汇总吧! 1.自动换行 div{ word-wrap:break-word; word ...

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

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

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

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

  6. css不受高度限制实现文本超出隐藏并以省略号结束

    文本超出省略号显示代码: overflow: hidden; text-overflow:ellipsis; white-space: nowrap;width: 100px; /*宽度做好限制*/ ...

  7. css文本超出省略号

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

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

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

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

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

随机推荐

  1. android ONVIF 组播探测在线摄像机

    http://blog.csdn.net/ghostyu/article/details/8182516 Android的Wifi,默认情况下是不接受组播的,见:http://developer.an ...

  2. delphi 中如何从数据库中读取数据自生成TreeView,只有两个字段,数据库结构如下。急急!!

    我的数据库结构如下:UnitId      UnitName01          中国 (根节点)0101        河北省(二级树)010101      河北省沧州市(三级树)0101010 ...

  3. 消息队列之ActiveMQ学习笔记(一、下载及安装)

    1.访问官网地址  http://activemq.apache.org/  ,进入Download 2.选择最新版本 3.或者选择历史版本 4.下载解压后 5.然后再 bin目录下选择对应版本,双击 ...

  4. SSH命令工具研究报告

    0 什么是SSH Secure Shell(安全外壳协议,简称SSH)是一种加密的网络传输协议,可在不安全的网络中为网络服务提供安全的传输环境.SSH通过在网络中创建安全隧道来实现SSH客户端与服务器 ...

  5. npm install, npm install -g, npm install --save, npm install --save-dev之间的区别

    1.npm install X 安装X到项目的node_modules文件夹 会修改package.json,在dependencies中写入依赖.(关于这一点,网上的大部分文章都是说,不会修改pac ...

  6. VS.左侧_蓝黄绿_竖线

    1.vs2013中,写代码中,旁边会出现蓝色或者黄色的线,请问是什么意思?求大神告知_百度知道.html(https://zhidao.baidu.com/question/1862841692529 ...

  7. 最新 迅雷java校招面经 (含整理过的面试题大全)

    从6月到10月,经过4个月努力和坚持,自己有幸拿到了网易雷火.京东.去哪儿.迅雷等10家互联网公司的校招Offer,因为某些自身原因最终选择了迅雷.6.7月主要是做系统复习.项目复盘.LeetCode ...

  8. 后端根据查询条件生成excel文件返回给前端,vue进行下载

    一.HTML代码 <el-col :xs="2" :md="2" :sm="3"> <el-button type=&qu ...

  9. vue-cli 打包后提交到线上出现 "Uncaught SyntaxError:Unexpected token <" 报错

    参考链接:https://segmentfault.com/a/1190000016919340

  10. ajax head带参数两次请求

    ajax请求head里带数据 客户端先发一次option看看能不能登录,然后再发一次post