<!DOCTYPE html>

<html>

 <head>

  <meta charset="UTF-8">

  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui">

  <meta name="apple-mobile-web-app-capable" content="yes">

  <meta name="apple-mobile-web-app-status-bar-style" content="black">

  <meta name="format-detection" content="telephone=no">

  <title>css实现多行文字限制显示</title>

  <style>

   #test {

       width:200px;

    display: box;

    display: -webkit-box;

    box-orient: vertical;

    -webkit-box-orient: vertical;

    line-clamp: ;

    -webkit-line-clamp: ;

    overflow: hidden;

    text-overflow: ellipsis;

   }

  </style>

 </head>

 <body>

  <p id="test">多行文字限制显示多行文字限制显示多行文字限制显示多行文字限制显示多行文字限制显示多行文字限制显示多行文字限制显示多行文字限制显示</p>

 </body>

</html>

CSS实现多行文字限制显示的更多相关文章

  1. css实现多行文字限制显示&编译失效解决方案

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name ...

  2. div+css使多行文字垂直居中?

    1.单行文字: 设置height = line-height; 多行文字: 设置 padding, 自己要计算一下? vertical-align: 可以设置垂直居中, 但是只是针对本身就具有 ali ...

  3. css 单行/多行文字垂直居中问题

    例子可以直接看这里http://www.zhangxinxu.com/study/200911/line-height-text-v-center.html 这篇文章中有一点点解释http://blo ...

  4. ios UILabel在storyBoard或xib中如何在每行文字不显示完就换行

    大家知道怎么用代码让label中的文字换行,只需要 label.numberOfLines = 0; label.text = @"这是第一行啦啦啦啦,\n这是第二行啦啦,\n这是第三行&q ...

  5. css布局-多行文字垂直居中

    方法一: 代码: <style> *{padding: ;margin:;font-size: 12px;} div{float: left;width: 200px;height:200 ...

  6. 纯CSS实现多行文字垂直居中几种方法解析

    场景:父元素 高度固定,如何使其中的文字垂直居中? 1.table布局: 利用display:table+display:table-cell的方法 <!DOCTYPE html> < ...

  7. 【css】多行文字图片混排容器内垂直居中解决方案

    css:   .box-wrap{display:table;width:200px;height:200px;*position:relative;}/*最外边的容器,需固定宽高*/ .box-ha ...

  8. css设置两行多余文字用..显示

    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;

  9. css如何设置首行文字缩进？

    在HTML网页中通常一段文字都需要设置首行缩进两个文字,使页面更加美观,我们可以通过css实现这一效果,下面我们就来看一下使用css设置首行文字缩进的方法. css可以使用text-indent属性来 ...

随机推荐

  1. Mac下eclipse的快捷键

    一.Command类 Command+1 快速修复 Command+d 删除当前行 Command+Option+↓ 复制当前行到下一行 Command+Option+↑ 复制当前行到上一行 Comm ...

  2. HZNU 与班尼特·胡迪一起攻破浮空城 【DP】

    题目链接 http://acm.hznu.edu.cn/OJ/problem.php?id=2264 思路 从终点往起点走 然后每次更新状态 因为要满足 最短路线 所以其实 只能是 往左走,往下走 或 ...

  3. 手写Future模式

    根据前面我所说的Futrue模式,手写一个: 分别对应的Java代码,大家拿来参考: package FutureTest; //公共data数据接口 public abstract class Da ...

  4. iOS description

    description:重写对象的这个方法,会在打印的时候显示出自定义的description中的内容debugDescription:方法是在开发者在调试器中以控制台命令打印对象时才调用的. 在NS ...

  5. hdu 2188 悼念512汶川大地震遇难同胞——选拔志愿者（Bash Game）

    题意:从0开始捐款,每次不超过m元,首先达到n元的获胜 思路:等同于从n开始,每次取不超过m,首先达到0的获胜.(Bash Game) #include<iostream> #includ ...

  6. apache web 服务器

    0. 特性与特点 性能方面,apache 在设计时采用了以"进程"为基础的结构,自然进程比线程消耗了更多的系统开销,导致了 apache 在多处理器环境中性能有所下降: 因此,在对 ...

  7. 并不对劲的bzoj1095:p2056:[ZJOI2007]捉迷藏

    题目大意 给一\(n\)(\(n\leq10^5\))个点的一棵树,每个点有可能是黑色或白色,一开始所有点都是黑色,支持以下两种操作: 1.改变一个点的颜色 2.询问最远的黑色点对的距离 题解 据说是 ...

  8. 初学Java（一）

    基本语法: 编写Java程序时,应注意以下几点: 1.大小写敏感:java是大小写敏感的,这就意味着标识符Hello与hello是不同的. 2.类名:对于所有的类来说,类名的首字母应该大写.如果类名由 ...

  9. 洛谷 1541 乌龟棋——dp

    题目:https://www.luogu.org/problemnew/show/P1541 以用了几张牌为阶段.注意知道了用了4种牌各几张后,当前位置就是确定的,所以不用记录什么的. #includ ...

  10. 小程序rpx

    rpx是微信小程序解决自适应屏幕尺寸的尺寸单位.微信小程序规定屏幕的宽度是750rpx, 微信小程序也支持rem尺寸单位,rem规定屏幕的宽度是20rem vw vh适配 vw和vh是css3中的新单 ...