<!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>

   /*
     编译的时候,默认会过滤-webkit-box-orient: vertical;导致多行文本省略显示不生效
     解决方案:关闭autoprefixer然后再开启并注释掉
  */

#test {

display: box;

display: -webkit-box;

box-orient: vertical;

  /* autoprefixer: off */

  -webkit-box-orient: vertical;

  /* autoprefixer: on */

line-clamp: 2;

-webkit-line-clamp: 2;

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. Windows下命令行Git无法显示中文问题解决方案

    Windows下Git设置编码正常显示中文: 在 CMD 下设置环境变量 set LESSCHARSET=utf-8 在 PowerShell 下设置环境变量 $env:LESSCHARSET='ut ...

随机推荐

  1. ZOJ 3213

    /* ZOJ 3213 好吧,看过那种括号表示法后,就崩溃了,实在受不了.情况复杂,写了两天,人也有点傻X了,只能放弃,转而用最小表示法. 最小表示法不难写: 1)首先,要承认路径上有格子不选的情况, ...

  2. springmvc 处理lsit类型的请求參数映射成实体属性

    <table align="center" cellspacing="10"> <tr> <td> 母码数目:<inp ...

  3. 通过buildpath 导入jar和在lib下导入的jar包区别

    jar包放置在WEB-INF/lib下和通过build path导入的区别是什么? jar包直接拷贝到WEB-INF/lib下和以userLibrary形式引入的区别? jar包放置在WEB-INF/ ...

  4. 1+2+3+...+n不能用while、for、if else等实现

    问题描写叙述 求 1+2+ - +n ,要求不能使用乘除法. for . while . if . else . switch . case 等keyword以及条件推断语句. 实际意义不大,题目涉及 ...

  5. Android5.0 Recovery源代码分析与定制(一)【转】

    本文转载自:http://blog.csdn.net/morixinguan/article/details/72858346 版权声明:本文为博主原创文章,如有需要,请注明转载地址:http://b ...

  6. spring:为javabean的集合对象注入属性值

    spring:为JavaBean的集合对象注入属性值 在 spring 中可以对List.Set.Map 等集合进行配置,不过根据集合类型的不同,需要使用不同的标签配置对应相应的集合. 1.创建 Ts ...

  7. ZOJ 2314 无源汇可行流(输出方案)

    Time Limit: 5 Seconds      Memory Limit: 32768 KB      Special Judge The terrorist group leaded by a ...

  8. P3959 宝藏 模拟退火。。。

    竟然模拟退火能做!我就直接抄代码了,我加了点注释. 题干: 题目描述 参与考古挖掘的小明得到了一份藏宝图,藏宝图上标出了 nn 个深埋在地下的宝藏屋, 也给出了这 nn 个宝藏屋之间可供开发的 mm ...

  9. 2205 等差数列(dp)

    2205 等差数列  时间限制: 1 s  空间限制: 32000 KB  题目等级 : 钻石 Diamond     题目描述 Description 等差数列的定义是一个数列S,它满足了(S[i] ...

  10. html5 历史管理

    1.onhashchange:改变hash值来进行历史管理. <!DOCTYPE html> <html> <head> <meta charset=&quo ...