【网摘自CSDN网站】当文本内容过多，展开更多 （css控制,）

<div class="more"><p class="btn">显示全部内容</p></div>
.more {display:none;padding-top:80px;background-image:-webkit-gradient(linear,left top,left bottom,from(rgba(255,255,255,0)),color-stop(70%,#fff));background-image:linear-gradient(-180deg,rgba(255,255,255,0) 0%,#fff 70%);position:absolute;bottom:.42rem;width:100%;}
.btn{color:#3196F7;letter-spacing:1px;font-size:.14rem;height:.4rem;line-height:.4rem;}

重点是： background-image:linear-gradient，与 padding-top

css 控制效果后便是这样，上面部分会带模糊效果。因为都是白色，并不是很明显。

原文地址：https://www.cnblogs.com/JaneBlog/p/9542783.html

时间： 2024-10-12 18:56:27

【网摘自CSDN网站】当文本内容过多，展开更多 （css控制,）的相关文章

CSS---解决内容过多就会出文本溢出（显示在区域外面，不换行的情况）

当我们设置我的的div,或者其它文本框固定宽度之后,文本内容过多就会出文本溢出(显示在区域外面,不换行的情况). 这时我们可以使用Css中的几个属于来解.有以下的三个属于可以解决问题: 1,word-break 属性规定自动换行的处理方法.word-break: normal|break-all|keep-all;值 描述normal 使用浏览器默认的换行规则.break-all 允许在单词内换行.keep-all 只能在半角空格或连字符处换行.2,overflow 属性规定当内容溢出元素框时发

php 实现从其他网站拷贝的富文本内容并将里面的图片抓取到本地

<span style="white-space:pre"> </span>function getImgByReg($str) { $list = array(); $c1 = preg_match_all('/<img\s.*?>/', $str, $m1); for($i = 0; $i < $c1; $i++) { $c2 = preg_match_all('/(\w+)\s*=\s*(?:(?:(["\'])(.*?)(?=

js实现动态给一个div添加文本内容与简单的日历

js实现动态给一个div添加文本内容(即在文本框中输入一段文字,点击设置文字按钮实现将文本框中的文字添加到div中) <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> </head> <style

辛星跟您玩转vim第四节之操作文本内容

首先值得一提的是.我的vim教程pdf版本号已经写完了.大家能够去下载,这里是csdn的下载地址:csdn下载,假设左边的下载地址挂掉了,也能够自行在浏览器以下输入例如以下地址进行下载:http://download.csdn.net/detail/xinguimeng/7714213 .当然.假设你是百度网盘的忠有用户.也能够借助于百度网盘,我也同步上传到百度网盘了,下载地址例如以下:百度网盘下载 .假设地址挂了,能够在浏览器中输入:http://pan.baidu.com/s/1sj9CLX

基于文本内容的压缩

数据压缩 减少不必要的资源加载之后,我们将剩下的资源进行压缩. 为了解释数据压缩的原则,我们创建一个txt文本,内容如下: # Below is a secret message, which consists of a set of headers in # key-value format followed by a newline and the encrypted message. format: secret-cipher date: 04/04/14 AAAZZBBBBEEEMMM

小米路由器mini如何设置外网访问wan网站的方法

很多的玩友都在小米路由器mini上面搭建了自己的网站,有些朋友还需要设置对外网进行开放,我自己也在路由器上面实践了使用,下面与大家分享一下如何设置外网访问路由器网站的办法. 工具/原料 小米路由器mini securecrt 浏览器 方法/步骤 在上一篇与大家分享了在小米路由器mini上搭建了自己的网站的办法,但是那只能内网访问的,下面与大家分享一下如何设置外网也可以访问自己的网站. 首先 我们  ssh远程连接进入小米路由器mini的命令行界面 然后编辑   /etc/config/firew

移动端html5页面长按实现高亮全选文本内容的兼容解决方案

最近需要给html5的WebAPP在页面上实现一个复制功能:用户点击长按文本会全选文字并弹出系统"复制"菜单,用户可以点击"复制"进行复制操作,然后粘贴到AppStore搜索对应的应用.之所以不是采用链接形式直接跳转到AppStore对应应用是为了通过用户的主动输入关键词搜索给推广的企业App增加权重.所以这一个"复制"功能对用户的体验至关重要. 尝试了一些做法,在安卓/iOS平台上的兼容性都不是很好.在微信浏览器内是很容易实现长按文本激发系统菜

观CSDN网站小Bug有感

今天早上在浏览博客的时候偶然发现CSDN博客的数据出现了异常,我也是头一次看到这么明显的Bug,具体什么表现呢?先来看两个截图,如下:    经常看CSDN博客的人一眼就可以看出来哪里出了问题,那就是博文的阅读次数停止了更新,换句话说就是那个数据失效了,我推断数据异常大概出现在昨天中午的时候,到现在为止没有解决掉,其实这也没什么,只是看着有点别扭而已,世界上没有不存在完美的程序,我也是头一次看到大型网站出现小bug,也许是以前见过但是没有看出来或者意识到. 当然我对异常的原因和解决办法更感兴趣,

Python发送多个附件和支持HTML及纯文本内容的 Email 实现

由于工作中经常需要收发电子邮件,例如每日(周)的工作报告,测试报告,监控告警,定时提醒等等,大都已电子邮件的形式发送.本文将实现一个 Python 的电子邮件发送类,支持发送多个附件(目录),HTML或纯文本内容,抄送收件人,多个接收者等功能. 代码实现 #!/usr/bin/env python # -*- coding: utf-8 -*- ''' Copyright (C) 2015 By Thomas Hu. All rights reserved. @author : Thomas H