<!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. 小米红米1S 电信/联通版 专用TWRP2.8.1.1中文版 (全屏触摸/支持MTP挂载内外置存储)

    转载请注明出处和链接: http://blog.csdn.net/syhost/article/details/39340477 说说中文TWRP的简史:          中文TWRP是本人在201 ...

  2. SQL 优化记录

    1. 对Where 语句的法则 1.1 避免在WHERE子句中使用in,not  in,or 或者having. 可以使用 exist 和not exist代替 in和not in. 可以使用表链接代 ...

  3. [python基础] Flasky-表单WTForms支持的html字段和内建函数

    WTForms 支持的HTML 标准字段如表4-1 所示.表4-1 WTForms支持的HTML标准字段字段类型              说 明StringField           文本字段T ...

  4. 实现泛型IEnumerable接口

    用C#实现一个类的IEnumerable接口时有两种方法:1)实现非泛型IEnumerable接口:2)实现泛型IEnumerable(T)接口.如果采用方法1,当集合元素T是值类型时,将涉及到巨多的 ...

  5. openStack enscaption

  6. leetcode矩阵与动态规划相关

    目录 54/59螺旋矩阵 62不同路径 64最小路径和 120三角形最小路径和 695岛屿的最大面积 547朋友圈 718最长重复数组 221最大正方形 121/122/123/714/188买卖股票 ...

  7. etcd数据备份与恢复验证

    一.单机 说明:执行etcd备份数据的恢复的机器必须和原先etcd所在机器一致 1.单机备份 etcdctl --endpoints="https://10.25.72.62:2379&qu ...

  8. Gym - 101981G The 2018 ICPC Asia Nanjing Regional Contest G.Pyramid 找规律

    题面 题意:数一个n阶三角形中,有多少个全等三角形,n<=1e9 题解:拿到题想找规律,手画开始一直数漏....,最后还是打了个表 (打表就是随便定个点为(0,0),然后(2,0),(4,0), ...

  9. sqlserver导入数据到mysql的详细图解

    SQL Server 迁移数据到MySQL 一.背景 由于项目开始时候使用的数据库是SQL Server,后来把存储的数据库调整为MySQL,所以需要把SQL Server的数据转移到MySQL:由于 ...

  10. 深入理解Redis——(总纲)

    前言 Redis这个东西,我来来回回的也搞了好几遍,之前更偏向于实战,很多时候只知其然而不知其所以然,最近借阅了一本<深入理解Redis>,就系统的整理一下. 为何选择Redis 开源免费 ...