css超出部分显示省略号
单行文本 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
.contain {
width: 300px;
height: 28px;
line-height: 28px;
margin: 50px 0 0 50px;
border: 1px solid rgb(0, 255, 128);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
} </style>
</head>
<body>
<div class="contain">
<span class="box">去年的五月正是我在北平吃青杏的季节，今年的五月我生活的痛苦真是有如青杏般苦涩。</span>
</div>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
.box {
display: -webkit-box;
width: 200px;
line-height: 1.5;
margin: 50px 0 0 50px;
border: 1px solid rgb(0, 255, 128);
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
</style>
</head>
<body>
<div class="contain">
<span class="box">去年的五月正是我在北平吃青杏的季节，今年的五月我生活的痛苦真是有如青杏般苦涩。</span>
</div>
</body>
</html>
css超出部分显示省略号的更多相关文章
- css 超出部分显示省略号
代码: overflow: hidden; white-space: nowrap; text-overflow: ellipsis; 重点代码:text-overflow: ellipsis; 解 ...
- css超出隐藏显示省略号怎么设置？
当我们在进行网页前端开发的时候,一般获取文章标题,然后一行一行的显示.但是当标题过长的时候,就会造成换行显示.还有显示部分文本信息时,如果全部显示就过于繁琐,会带来不会的网页体验感.虽然我们可以使用o ...
- CSS超出部分显示省略号…代码
让DIV,LI等元素超出部分文字用省略号…显示. 示例: 兼容IE/Firefox/Chrome 代码: display:block;white-space:nowrap; overflow:hidd ...
- css 超出部分显示省略号 汇总
单行: 加宽度 overflow: hidden; text-overflow:ellipsis; white-space: nowrap; 多行: display: -webkit-box; -we ...
- CSS实现单行、多行文本超出部分显示省略号
单行文本超出,代码如下: css代码: <style> .one{ width:200px; overflow: hidden; text-overflow:ellipsis; whit ...
- css文字超出自动显示省略号
只针对单行文本有效: 01.针对块状元素 ul li{ width: 180px; text-overflow: ellipsis; white-space: nowrap;/*禁止自动换行*/ ov ...
- CSS——文本超出隐藏显示省略号
文本超出隐藏显示省略号 1.单行文本的溢出显示省略号 overflow: hidden; text-overflow:ellipsis; white-space: nowrap; // overflo ...
- css文本强制两行超出就显示省略号,不显示省略号
1. 强制一行的情况很简单 overflow:hidden; //超出的隐藏 text-overflow:ellipsis; //省略号 white-space:nowrap; //强制一行显示 2. ...
- Table组件设置文字超出宽度显示省略号，鼠标悬停以悬浮框显示
一.设置文字超出宽度显示省略号 注意点: 1. 需要指定column的width属性,否则列头跟内容可能不对齐.需要留一列不设置宽度以适应弹性布局. 2. 列宽度width必须大于ellipsis的 ...
随机推荐
- Office Adobe Acrobat把PDF转换为Word时候提示不支持的Type2字体怎么办
如下图所示,在使用Adobe Acrobat Pro9将PDF转换为Word的时候出现下面的错误 很简单,不要用Adobe Acrobat Pro9了,用Adobe Acrobat Pro X,还 ...
- 提升Android编译速度
Android codebase都非常大.编译一次都须要花非常多时间.假设是preloader/lk/bootimage还好,可是Android的话都是非常久. 实际上这个编译时间还是能够进一步缩短! ...
- 程序C++ to C#交互
第一次用C#调用C/C++生成的DLL文件,感觉有点新鲜,事实上仅仅是实现了执行在公共语言执行库 (CLR) 的控制之外的"非托管代码"(执行在公共语言执行库(CLR)的控制之中的 ...
- HTML5开发实战——Sencha Touch篇(1)
学习了很多主要的Sencha Touch内容,已经了解了Sencha Touch的开发模式.接下来一段时间我们将利用Sencha Touch来进行自己的web应用构建. 先要解决的是前端的问题.从最简 ...
- 嵌入式开发之davinci---dm8127 ipipe
http://blog.csdn.net/dog0138/article/details/4212576 http://e2e.ti.com/support/dsp/davinci_digital_m ...
- HDU 5274 Dylans loves tree 树链剖分+线段树
Dylans loves tree Problem Description Dylans is given a tree with N nodes. All nodes have a value A[ ...
- 包管理 import debug 模块管理 module
import sys, os this_file_abspath = os.path.dirname(os.path.abspath(__file__)) ProjectUtil_path = '{} ...
- http://www.freetds.org/userguide/what.htm
FreeTDS is re-implementation of C libraries originally marketed by Sybase and Microsoft SQL Server. ...
- sql 统计 url字符串处理
SELECT SUBSTRING_INDEX(url,'/',1) AS wed_domain,COUNT(1),SUM(no_open_times),SUM(no_ad_times),SUM(ok_ ...
- Latex 1: 解决latex中遇到一个常见错误:"Improper alphabetic constant."
1.问题: 本人是在WIN7下用texlive 2016,编辑器用的是WinEdt 10.1 ,运行如下代码: \documentclass{ctexbook} \begin{document} \t ...