用-webkit-私有属性，代码如下：
text-overflow: -o-ellipsis-lastline;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;

另外还有其他方法可以解决这个问题：
1、通过js来控制字数，然后截取文字
下面是一个例子：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>例子</title>
<style type="text/css">
.demo{width:100px;}
</style>
</head>
<body>
<div class="demo" id="demo">怎么显示两行或三行文字，然后多出的部分省略号代替?</div>
<script>
// js无法直接通过class获取对象，必须自己写一个方法,这样效率会非常低，原生js里最好用id获取，直接用id获取domo对象

var oBox=document.getElementById('demo');
// slice() 方法可从已有的数组中返回选定的元素。
// 您可使用负值从数组的尾部选取元素。
// 如果 end 未被规定，那么 slice() 方法会选取从 start 到数组结尾的所有元素。
// 此处需要根据需求自行修改slice()的值，以达到要显示的内容
var demoHtml = oBox.innerHTML.slice(0,10)+'...';
// 填充至指定位置
oBox.innerHTML = demoHtml;
</script>
</body>
</html>

2、还有一种方法是通过后台控制，用程序控制，程序输出时来控制；这个不会……

div内文字显示两行，多出的文字用省略号显示的更多相关文章

  1. CSS——div内文字的溢出部分用省略号显示

    使得div内文字的溢出部分用省略号显示,可归纳为两种解决办法,一种方法是用CSS解决,另一种方法是js解决. 一.通过CSS控制显示 div内显示一行,超出部分用省略号显示 div内显示多行,超出部分 ...

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

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

  3. css 实现div内显示两行或三行，超出部分用省略号显示

    一.div内显示一行,超出部分用省略号显示 white-space: nowrap;    overflow: hidden;    text-overflow: ellipsis; 二.div内显示 ...

  4. All about Div内显示滚动桥

    Div内显示滚动桥看似是一个简单的前端问题,然而实际会发现还是有挺多需要注意的, 本文尝试对div内显示滚动桥的各种主要实现及一些难题进行研究. 横向滚动桥 横向滚动桥比较简单,无需设置宽度,直接ov ...

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

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

  6. css一div内文字居中

    在说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的CSS Hack技术就可以啊!所以在这里我还要啰嗦两句,CSS中 ...

  7. CSS——div垂直居中及div内文字垂直居中

    最近做demo时,经常需要div垂直居中或者让div内文字相对div垂直居中.水平居中比较简单,就不多说了,这里主要记录一下垂直居中的一些方法. 一.div垂直居中的一些方法: 1.当height.w ...

  8. 关于DIV内文字垂直居中的写法

    最近在写UI,或多或少用到了CSS,在这记录一下,今天用到的DIV内文字垂直居中的写法, 因为所做的项目都是基于WebKit内核浏览器演示的,所以我们今天采用的是-webkit-box的写法: dis ...

  9. 如何让div中的文字只显示一行，多余的文字隐藏并加上省略号（超链接形式）

    写页面的时候遇到了一个小小的问题,如何让div中一行超链接文字只显示一行,多余的文字隐藏并加上省略号,悬浮时隐藏的文字显示出来?解决问题时发现了css3的一个新标签  text-overflow  , ...

随机推荐

  1. Mysql简单笔记

    对oracle还是比较熟悉的,对mysql也是零散的有些了解,今天看了下,简单总结: 1.查看mysql版本:mysqladmin --version2.查看mysql进程:ps -ef|grep m ...

  2. GridView 翻页 索引超出范围

    事件回顾 今天GridView翻页时,又遇到错误:索引超出范围.必须为非负值并小于集合大小. 这是当时的PageIndexChanging和RowCommand两个事件的后台代码 protected ...

  3. Windows环境下使用python 3.x自带的CGI服务器测试cgi脚本--Python

    1.在桌面上新建一个文件夹作为服务器目录文件夹(文件夹名称自定义,文件夹位置自定义),在www文件下再建一个文件夹,文件夹名为“cgi-bin”,须是这个文件名,其他试过不行(原因暂时未知)

  4. Entity Framework 乐观并发处理

    Entity Framework 乐观并发处理 有一段时间没有更新博客了,今天终于有一些时间,和大家讨论一个Entity Framework 乐观并发处理的问题.首先需要说明的是,这里提到的 “并发” ...

  5. springmvc后台取值中文乱码问题

    字符-->字节.字节-->字符时需要用到编码(Encoder).解码(Decoder) 几种编码: ASCII:总共128 ISO-8859-1:涵盖大部分西欧语言字符.一个字符一个字节表 ...

  6. 搬瓦工搭建SS的教程

    前言 作者写在前面的话: 应同学的要求在此分享搬瓦工搭建SS的教程,此教程只作为学习之用,因某些原因本教程不适合长期使用,在大家学习之后请删除所做的操作,谢谢. 为方便以后查看,请及时收藏:GitHu ...

  7. webpack深入场景——开发环境和生产环境配置

    以前自己写一小项目时,webpack的配置基本就是一套配置,没有考虑生产环境和开发环境的区分,最近在做一个复杂的商城项目接触到了webpack的高级配置,经过两天的研究,写出了一份目前来说比叫满意的配 ...

  8. WPF-悬浮窗（类似于360）

    boss要求开发一个类似于360的悬浮窗,如下图所示: 目前采用的是wpf做的客户端,之前有个winform的项目,我参考了下,完成了wpf版的悬浮窗. Height=" WindowSta ...

  9. 读 《 Web 研发模式的演变 》与《Javascript:世纪机器语言》

       读了两篇文章,内心还是很震撼的,在这之前,我学习知识都是直接找教程,翻阅资料,写几个小demo,没有去了解我所学的东西的发展历程,<Web研发模式的演变>这篇文章讲述了web的前世今 ...

  10. OSI模型和TCP/IP协议族(一)

    1990年以前,再数据通信和组网文献中占主导地位的分层模型是开放系统互连(Open System Interconnnection,OSI)模型.当时所有人都认为OSI模型将是数据通信的最终标准,然而 ...