CSS把容器中的内容限制行数,在超过行数后,在最后一行显示"..."
<style type="text/css">
.main{
width: 400px;
background-color: #3498db;
display: -webkit-box; /*值必须为-webkit-box或者-webkit-inline-box*/
-webkit-box-orient: vertical; /*值必须为vertical*/
-webkit-line-clamp:; /*值为数字,表示一共显示几行*/
overflow: hidden;
}
</style> <div class="main">
多行文字溢出多行文字溢出多行文字溢出多行文字溢出多行文字溢出多行文字溢出多行文字溢出多行文字溢出多行文字溢出多行文字溢出多行文字溢出多行文字溢出多行文字溢出多行文字溢出多行文字溢出多行文字溢出多行文字溢出多行文字溢出多行文字溢出多行文字溢出<
</div> 结果:
多行文字溢出多行文字溢出多行文字溢出多行文字溢出多
行文字溢出多行文字溢出多行文字溢出多行文字溢出多行
文字溢出多行文字溢出多行文字溢出多行文字溢出多...
CSS把容器中的内容限制行数,在超过行数后,在最后一行显示"..."的更多相关文章
- CSS总结div中的内容垂直居中的五种方法
一.行高(line-height)法 如果要垂直居中的只有一行或几个文字,那它的制作最为简单,只要让文字的行高和容器的高度相同即可,比如: p { height:30px; line-height:3 ...
- docker学习笔记:修改无法启动的容器中的内容
我们可能会碰到这样的一个问题,在容器执行过程中,修改了容器的内容(如配置文件信息),但因为修改出了问题.导致容器关闭后,无法启动. 这事需要重新修改配置文件. 正常情况下可以通过 docker exe ...
- 使用copy函数输出容器中的内容
container<type> c; 输出语句为:copy(c.begin(), c.end(), ostream_iterator<type>(cout, " &q ...
- 通过CSS控制页面中的内容垂直居中的方法
方法一:通过行高(line-height)定位 line-height通常是用于调节一段文字的行与行之间的距离,或者说两行文字之间的距离,如果行高是500px,那么每一行中的文字距离本行的顶部就是25 ...
- css 使容器宽度适应内容宽
p{ width:intrinsic; width: -moz-max-content; width: -webkit-max-content; float:right; width:auto; /* ...
- 集合案例--对ArrayList容器中的内容进行排序
package com.Set; import java.util.ArrayList; import java.util.Collections; import java.util.Comparat ...
- 前端页面中如何在窗口缩放时让两个div始终在同一行显示
直接贴代码吧 先总结一下吧 有两种方法 一 最外层设置一个大div 给这个大div固定的宽度和高度 给里面两个小div 设置浮动 设置宽高 <!DOCTYPE html> &l ...
- C++(五十) — 容器中元素满足的条件
容器中的内容必须满足三个条件: (1)无参构造函数 (2)拷贝构造函数 (3)重载 = 运算符 #define _CRT_SECURE_NO_WARNINGS #include <iostrea ...
- 开发时从宿主机连接容器中的MySQL
从宿主机连接Docker容器中的MySQL 刚接触Docker,电脑安装Docker后,使用docker命令pull了一个MySQL5.6的Docker镜像,之后docker run启动创建容器. 可 ...
随机推荐
- elasticSearch插件metricbeat收集nginx的度量指标
ngx_http_stub_status_module模块是Nginx中用来统计Nginx服务所接收和处理的请求数量,只要在编译安装Nginx的时候加上参数--with-http_stub_statu ...
- Flask03-Form
## Web 表单 配置 为了能够处理 web 表单,我们将使用 Flask-WTF ,该扩展封装了 WTForms 并且恰当地集成进 Flask 中. 许多 Flask 扩展需要大量的配置,因此我们 ...
- 关于JavaScript函数
object.defineProperty()函数 再学习这个函数之前,我们先创建一个object对象 var person = {} person.name = "junlebao&quo ...
- 在MFC下绘制直线,使用橡皮筋技术,可以使直线效果跟随鼠标移
void CGraphic1View::OnMouseMove(UINT nFlags, CPoint point) { if(MK_LBUTTON == nFlags) { ...
- GDI+ 双缓冲实现
早前曾为此问题在CSDN发帖求助(GDI+ 如何使用双缓冲绘制图像),得到了一个GDI+下较可行的方法,虽然绘制效果比直接绘制要好一些,不过还不能跟GDI的双缓冲方式比肩. 现在,我终于找到了一个 ...
- HDU3686 Traffic Real Time Query【缩点+lca】
题目 City C is really a nightmare of all drivers for its traffic jams. To solve the traffic problem, t ...
- Spring系列.Bean简介
Bean属性配置 Spring在读取配置文件中bean的metadata后会构造一个个BeanDefination对象.后面Spring会根据这些BeanDefinition创建对象.在配置一个bea ...
- HotSpot二分模型(1)
HotSpot采用了OOP-Klass模型来描述Java类和对象.OOP(Ordinary Object Pointer)指的是普通对象指针,而Klass用来描述对象的具体类型. 那么为何要设计这样一 ...
- 相邻元素之间的margin合并问题
任何元素都可以设置border 设置宽高可能无效 行内元素设置padding,margin上下是无效的,左右是有效的 外边距合并:指的是,当两个垂直外边距相遇时,它们将形成一个外边距. 合并后的外边距 ...
- window的常用操作
一.window.location location对象属性 1.location.href 属性返回当前页面的 URL. 2.location.pathname 返回路径和方法名称 3.locati ...