css 多行溢出

<div style="
height: 38px;
    max-width: 180px;
    -webkit-box-orient: vertical;
    word-break: break-all;
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
">1222222222222222222222222222222222222222222222222222222222222222333333333333333333333333333333333333</div>    
时间: 2024-08-18 22:02:28

css 多行溢出的相关文章

CSS多行溢出隐藏,webpack打包删除代码 -webkit-box-orient: vertical;

文本多行溢出隐藏显示省略号,本地显示正常,打包后线上代码丢失,-webkit-box-orient: vertical; /*! autoprefixer: off */ -webkit-box-orient:vertical; /*! autoprefixer: on */ 解决方式 1 :使用autoprefixer 跳过webpack的css打包. 解决方法 2 : 待补充 原文地址:https://www.cnblogs.com/lishengye/p/10990248.html

CSS实现文本溢出的部分用省略号代替的方法

我们通常在设计网页的时候,由于相关的需求需要一行定宽,然而有时候文字的展现过长就会溢出.今天,E良师益友网就单行和多行两种情况来说明一下溢出的文字用省略号代替. 一.单行溢出 1,单行溢出,超出部分显示...或者截取.前提必须有宽度. CSS:{width:xxpx;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;},截取为clip; 实现代码: width:300px; overflow: hidden; text-overf

CSS换行文本溢出显示省略号

现代浏览器中使用css可以实现文本溢出,使用 text-overflow: ellipsis;在有些场景下没有效果,这个时候你需要检查应用的场景是是否是块元素,是否有确切的width. 如果是行内元素则需要使用display设置为inline-block; 下面是对a,span等行内元素的使用CSS换行文本溢出显示省略号的比较准确的用法: a,span { overflow: hidden; text-align: center; text-overflow: ellipsis; white-s

文本单行溢出,多行溢出处理方案【...】

单行溢出: 单行文本中文字超过固定宽高后显示... CSS{ width:500px;height:30px;overflow:hide;text-overflow: ellipsis;white-space: nowrap;}   宽度和高度必须固定 多行溢出: 处理多行溢出,考虑兼容性问题,个人认为采用JS来解决最直接了当 HTML: <div class="word"> <p>这是一段将会多行溢出的文字这是一段将会多行溢出的文字这是一段将会多行溢出的文字这

css实现文本溢出显示...

在网页中显示文字内容时,经常会碰到文字内容特别长的情况,那么这个时候为了使网页看起来比较美观和简洁,会对内容进行处理.下面我们就来看一看,如何使用css来对文字溢出部分增加.... 首先来看第一种情况,对单行文字处理. <h2>单行溢出显示...</h2> <div class="single-line"> 我是单行文本我是单行文本我是单行文本我是单行文本我是单行文本我是单行文本我是单行文本我是单行文本 </div> 页面显示的情况是这样

多行溢出 ,文本显示为省略号如何写

多行溢出 ,文本显示为省略号怎么写? 我想请问下,多行溢出 ,文本显示为省略号怎么写啊??555一行的可以,多行的就不行了哇~ ------解决思路----------------------用js获得一下这个div里文字的个数,当超过一定数量后substring一下,在加个...覆盖div原来的值试试貌似专门有个样式实现这个功能 忘掉了 ------解决思路----------------------设定一个宽度:设置css样式: text-overflow:ellipsis; white-s

005_堆行溢出

/* 堆数据表是没有聚集索引的表.即数据行不按任何特殊的顺序存储,数据页也没有任何特殊的顺序. 分配单元是堆或 B 树内用于根据页类型管理数据的页集合. 数据页的结构大体包括三个部分:标头.数据行和行偏移量. 分配单元类型:IN_ROW_DATA        包含除大型对象 (LOB) 数据以外的所有数据的数据行或索引行. 页的类型为 Data 或 Index. LOB_DATA           以下列一种或多种数据类型存储的大型对象数据:text.ntext.image.xml.varc

用css截取字符 css排版隐藏溢出文本

方法一: <div style="width:300px; overflow:hidden;  text-overflow:ellipsis; white-space:nowrap;"> 任意长度的字符串  </div> 说明:优点是内容可以为任何HTML元素,包括超链接和图片等,在IE6中还会在结尾自动显示省略号.缺点是必须指定宽度数值,并且宽度不能是百分数,否则在IE中会被认为是字符总长的百分比. 方法二: <input type="text

CSS设置行内元素和块级元素的水平居中、垂直居中

CSS设置行内元素的水平居中 div{text-align:center} /*DIV内的行内元素均会水平居中*/ CSS设置行内元素的垂直居中 div{height:30px; line-height:30px} /*DIV内的行内元素均会垂直居中*/ PS:当然,如果既要水平居中又要垂直居中,那么综合一下 div{text-align:center; height:30px; line-height:30px} CSS设置块级元素的水平居中 div p{margin:0 auto; widt