HTML(多行)文本超过部分隐藏,末尾显示(...)
HTML(多行)文本超过部分隐藏,末尾显示(...)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML(多行)文本超过部分隐藏,末尾显示(...)</title>
</head>
<style>
/* 一行 */
.overline {
max-width: 200px;
display: inline-block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
} /* 一行 */
.overline1 {
max-width: 200px;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
} /* 多行 */
.overline2 {
max-width: 200px;
display: -webkit-box;
-webkit-line-clamp: 2;/* 行数 */
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}
</style>
<body>
<p class="overline">
演示演示演示演示演示演示演示演示演示演示演示演示
演示演示演示演示演示演示演示演示演示演示演示演示
演示演示演示演示演示演示演示演示演示演示演示演示
演示演示演示演示演示演示演示演示演示演示演示演示
</p> <p class="overline1">
演示演示演示演示演示演示演示演示演示演示演示演示
演示演示演示演示演示演示演示演示演示演示演示演示
演示演示演示演示演示演示演示演示演示演示演示演示
演示演示演示演示演示演示演示演示演示演示演示演示
</p> <p class="overline2">
演示演示演示演示演示演示演示演示演示演示演示演示
演示演示演示演示演示演示演示演示演示演示演示演示
演示演示演示演示演示演示演示演示演示演示演示演示
演示演示演示演示演示演示演示演示演示演示演示演示
</p>
</body>
</html>
HTML(多行)文本超过部分隐藏,末尾显示(...)的更多相关文章
- HTML中文本过长时自动隐藏末尾部分或中间等任意部分
一. 一般情况下,HTML字符串过长时都会将超过的部分隐藏点,方法如下: 设置CSS: .ellipsis-type{ max-width: 50px; ...
- 【CSS】隐藏多行文本框Textarea在IE中的垂直滚动栏
在<[CSS]禁止Google浏览器同意定义调整多行文本框>(点击打开链接)中已经提及过怎样使多行文本框Textarea在一些DOM2的浏览器中固定下来. 这不,多行文本框Textarea ...
- 使用 js 实现文本过多时隐藏部分文本
使用 js 实现文本过多时隐藏部分文本 情景描述: 有时候我们需要显示部分文字,就像 QQ 空间这样,先显示部分文字,加一个[查看全文],让用户选择是否查看全部 解决方法: 第一步:在一个 id 为 ...
- Delphi TMemo 可以显示、编辑多行文本
多行编辑框组件(TMemo)TMemo组件可以显示.编辑多行文本,是一个标准的Windows多行编辑组件.对一些比较多的文本内容可以利用TMemo组件来显示.编辑. 1.TMemo组件的典型用法 TM ...
- css如何实现多行文本时,内容溢出,出现省略号
一:单行文本出现省略号: .oneLine{ white-space: nowrap; text-overflow: ellipsis; overflow: hidden; width: 100px; ...
- DataGridView 行、列的隐藏和删除
) 行.列的隐藏 [VB.NET] ' DataGridView1的第一列隐藏 DataGridView1.Columns(0).Visible = False ' DataGridView1的第一行 ...
- sharepoint更新多行文本webparth
前台 <script> function Copy() { var value = document.getElementById("<%=BodyBox.ClientID ...
- 禁止多行文本框textarea拖拽
禁止多行文本框textarea拖拽: textarea { resize: none; } resize这个是用于元素缩放,它可以取以下几个值: none 默认值 both 允许水平方向及垂直方向缩放 ...
- JS控制文本框中的密码显示/隐藏功能
<html> <head> <title>[荐]JS控制文本框中的密码显示/隐藏功能_网页代码站(www.6a8a.com)</title> <s ...
随机推荐
- windows配置Lua开发环境
官网上下载的不靠谱,很多库不能用,你如 require "socket" 如果没有vc那些编译也麻烦,摸索了很久,直接下载安装文件安装即可: 安装这两个就行: 先安装C++2005 ...
- CentOS 7 上安装 Django 2.2.4,解决报错:No module named ‘_sqlite3′
1.首先下载最新版的sqlite :https://www.sqlite.org/download.html 下载源码包: 配置和编译方法如下: ./configure --prefix=/usr/l ...
- C#中? 和 ??的区别
背景 最近在调试C#项目的时候,发现一个比较关于??的特殊用法,当时把我给惊到了,所以特意用这篇短短的笔记来记录一下我的解惑过程: 示例代码: showsomething(isNameNull ?? ...
- [Python]获取win平台文件的详细信息
import win32api def getFileProperties(fname): """ 读取给定文件的所有属性, 返回一个字典. ""&q ...
- HDU4192 Guess the Numbers(表达式计算、栈)
题意: 给你一个带括号.加减.乘的表达式,和n个数$(n\leq 5)$,问你带入这几个数可不可能等于n 思路: 先处理表达式:先将中缀式转化为逆波兰表达式 转换过程需要用到栈,具体过程如下:1)如果 ...
- 低功耗蓝牙ATT/GATT/Profile/Service/Characteristic规格解读
什么是蓝牙service和characteristic?到底怎么理解蓝牙profile?ATT和GATT两者如何区分?什么又是attribute?attribute和characteristic的区别 ...
- 某cms审计思路,以及ci框架如何找寻注入点
某cms审计思路,以及ci框架如何找寻注入点 ABOUT 之前闲着没事的时候审的某cms,之前看一群大表哥刷过一次这个cms,想着看看还能不能赶得上分一杯羹,还是审计出来些东西,来说一说一个前台注入吧 ...
- 《Head first设计模式》学习笔记
1. 单例模式 2. 工厂模式 3. 抽象工厂 4. 策略模式 5. 观察者模式 6. 装饰者模式 7. 命令模式 8. 适配器模式 9. 外观模式 10. 模版方法模式 11. 迭代器模式 设计模式 ...
- Centos 下设置静态ip地址
今天小编遇到了需要设置centos(6.4) 下静态ip地址,下面把详细步骤记录下来. 1> 首先打开这个 vi /etc/sysconfig/network-scripts/ifcfg- ...
- Mysql 命令 操作
1.user表 如果需要从其他机器连接 mysql 服务器报这个错“ERROR 1130: Host 'root' is not allowed to connect to this M ...