css 控制文字显示两行,多余用省略号 手机端
p {
width:100px;
position:relative;
line-height:20px; /*行高为高度的一半,这样就是两行*/
height:40px;
overflow:hidden;
}
p:after { /*使用伪元素*/
content:"...";
position:absolute;
bottom:0;
right:0;
background:#FFF; /*这个背景色要和p的背景色一致,也就是做个假^_^*/
padding-left:6px; /*这里自己调一调*/
}
css 控制文字显示两行,多余用省略号 手机端的更多相关文章
- CSS控制文字显示一行,超出显示省略号
这几天在项目需求里面遇到了很多之前没做过的需求,也慢慢更加认识到了css的强大,是真的强大.以后会把自己技术调研的东西都写出来,哪怕只是一点点或者很小的点,重在学习. “CSS控制文字显示一行,超出显 ...
- css控制文字显示长度,超过用省略号替代
.line_text { width:200px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } <span cl ...
- css 控制文本显示两行 超过省略号显示
display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; word-break: break-all; ov ...
- 使用css控制文字显示几行并且剩余部分隐藏(移动端和PC端同样适用)
前言 有些需求需要我们控制一段文本最多显示几行,就像逛淘宝京东的评价楼层一样,有时可能还需要隐藏剩余部分,这样的需求我们怎么来解决呢? 解决办法 我们完全可以使用css来解决这一需求 1. 解决文本显 ...
- css控制文字长度,超出长度显示...
css控制文字长度,超出长度显示... .style { max-width: 165px; overflow: hidden; white-space: nowrap; text-overflow: ...
- --css 控制文字多使用省略号
--css 控制文字多使用省略号.overflowPoint{ text-overflow:ellipsis;width: 200px;overflow: hidden;}<div class= ...
- css限制文字显示字数长度,超出部分自动用省略号显示,防止溢出到第二行
为了保证页面的整洁美观,在很多的时候,我们常需要隐藏超出长度的文字.这在列表条目,题目,名称等地方常用到. 效果如下: 未限制显示长度,如果超出了会溢出到第二行里.严重影响用户体验和显示效果. 我们在 ...
- 2016/04/13 ①html 中各种分割线------------------------------------------ ② 控制文字显示
①各种分割线Html代码 1.<HR> 2.<HR align=center width=300 color=#987cb9 SIZE=1>align 线条位置(可选left. ...
- css控制div显示/隐藏方法及2种方法比较原码 - czf164的专栏 - 博客频道 - CSDN.NET
body{ font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI& ...
随机推荐
- [物理学与PDEs]第1章第4节 电磁能量和电磁动量, 能量、动量守恒与转化定律 4.3 电磁能量 (动量) 密度, 电磁能量流 (动量流) 密度
1. 电磁能量密度: $\cfrac{1}{2}\sex{\ve_0E^2+\cfrac{1}{\mu_0}B^2}$. 2. 电磁能量流密度向量: ${\bf S}=\cfrac{1}{\mu_0} ...
- CF611D lcp+dp
本篇博客只是留个辣鸡的自己标记一下,误入的同学请出门左转博客 https://blog.csdn.net/loy_184548/article/details/50865777 代码神马的也是复制啊 ...
- js实现可输入的下拉框
<HTML> <HEAD> <META http-equiv='Content-Type' content='text/html; charset=gb2312'> ...
- Kotlin 检查空类型
Kotlin 会检查你定义的非空类型 如果运行过程中被赋空值了 会直接crash
- SQL Server - case when...then...else...end
Case具有两种格式.简单Case函数和Case搜索函数. --简单Case函数 CASE sex ' THEN '男' ' THEN '女' ELSE '其他' END --Case搜索函数 ' T ...
- php页面编码设置
php的header来定义一个php页面为utf编码或GBK编码 php页面为utf编码 header("Content-type: text/html; charset=utf-8&quo ...
- Android开发之字体设置
默认字体 Android SDK自带了四种字体:"normal"“monospace",“sans”, “serif”,如下: 字体 看这四兄弟长的还是蛮像,我是看不 ...
- Mac新系统常用设置
一.MAC OS整个系统的隐藏文件显示可见,在终端下输入以下命令defaults write com.apple.finder AppleShowAllFiles -bool true 二. 在MAC ...
- mac os app 开发
macOS 新手开发:第 1 部分 macOS 新手开发:第 2 部分 macOS 新手开发:第 3 部分
- Main Thread Checker 问题解决
1. without a return value https://developer.apple.com/documentation/code_diagnostics/main_thread_che ...