给div设置background-color: rgba(0, 0, 0, 0.2)属性,并加了css3动画--opacity动画淡出动画,之后div子元素的字体会抖一下
问题:给div设置background-color: rgba(0, 0, 0, 0.2)属性,并加了css3动画--opacity动画淡出动画,之后div子元素的字体会抖一下;
解决:animation: myfirst 2s;加上animation: myfirst 2s forwards;之后就可以了,
要实现的样式:div框淡出,但保证div的字体opoacity为1,要不然字体不清晰。(如果给div设置opacity,div子元素都会有透明度)
解决方案:用background-color: rgba(0, 0, 0, 0.2)给div设置背景色,css3动画也设置background-color: rgba(0, 0, 0, 0.2)属性
eg:
@keyframes show {
0% {
background-color: rgba(0, 0, 0, 0);
}
100% {
background-color: rgba(0, 0, 0, 0.2);
}
}
给div设置background-color: rgba(0, 0, 0, 0.2)属性,并加了css3动画--opacity动画淡出动画,之后div子元素的字体会抖一下的更多相关文章
- 设置background属性使用selector的时候内置?attr报错的解决方案
当我们设置background属性的时候可以设置background="@color/black" 也可以设置 background="@drawable/selecto ...
- div样式text-align在子元素缩进不规范的情况下,chrome出现的问题(貌似结果是inline-block导致的)
在调css的时候,发现居然有firefox实现效果完整而chrome出现问题的情况: 详细情况:segmentfault1 segmentfault2 全文表达: <html><he ...
- div鼠标悬停,子元素上移,鼠标移出,子元素下移动画。
HTML: <div class="edt_title" > <div id="edt_title"> <p class=&quo ...
- 父元素设置min-height子元素设置100%问题
问题:父元素设置min-height子元素高度设置100%取不到值,这是因为子元素 div设置 height:100%: 只有当父级元素满足min-height:1000px;设置的条件才触发: 浏览 ...
- CSS关于子元素设置了float属性后父元素高度为0的解释和解决方法
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...
- 第4天:JS入门-给div设置宽高背景色
今天学习了js入门课程,听的不多,做了个小练习,给div设置宽高.背景色.一点点都是进步.核心代码如下: <!DOCTYPE html><html lang="en&quo ...
- 【html/css】若母div设置了透明度,如何才能使得里面的子div不继承母div的透明度
用rgba的方式给母div设置透明度的话就不会影响子div的透明度了. 例: background: rgba(51, 51, 51, 0.5);
- position:absolute 按钮左右分布:left:0 和 right:0 以及雪碧图
问题:把两个a标签按钮 垂直居中,并且分别把两个按钮放在水平左右两边顶部1,祖父元素设定:position:relative2,把.arrow 设定上下垂直居中 position:absolute; ...
- 子DIV设置margin-top影响父DIV位置的解决办法
父div如果没有任何东西,子div设置margin-top,父div会下落 <!DOCTYPE html> <html lang="en"> <hea ...
随机推荐
- tracert-命令小结
前言:今天在阅读“Web性能权威指南”这本书的时候,发现 tracert 这个命令挺有意思的,在分析网络性能瓶颈的时候也能使用的到,在此就小记一笔以备后用. 1:作用 tracert 是一 ...
- IntelliJ IDEA 自动化工具安装并添加自动化测试框架
IntelliJ IDEA是一个用于开发人员开发和测试人员自动化测试的测试工具,类似于eclipse. 优点:插件多自身可以携带,自身携带cucumber自动化测试框架,类似于junit一样 缺点:r ...
- C++对象模型详解
原文链接:吴秦大神的C++对象模型. 何为C++对象模型? C++对象模型可以概括为以下2部分: 1.语言中直接支持面向对象程序设计的部分: 2.对于各种支持的底层实现机制. 语言中直接支持面向对象程 ...
- JUC.Lock(锁机制)学习笔记[附详细源码解析]
锁机制学习笔记 目录: CAS的意义 锁的一些基本原理 ReentrantLock的相关代码结构 两个重要的状态 I.AQS的state(int类型,32位) II.Node的waitStatus 获 ...
- Verilog $random用法
“$random函数调用时返回一个32位的随机数,它是一个带符号的整形数...”,并给出了一个例子: _________________________________________________ ...
- js和java MD5加密
项目中用到js MD5加密和后台java MD5加密,刚开始加密后两个不一致,网上找了好久终于找到一个啦,记下来: md5.js /* * A JavaScript implementation of ...
- Hadoop HDFS编程 API入门系列之RPC版本1(八)
不多说,直接上代码. 代码 package zhouls.bigdata.myWholeHadoop.RPC.rpc1; import java.io.IOException;import java. ...
- Tengine
Tengine是由淘宝网发起的Web服务器项目.它在Nginx的基础上,针对大访问量网站的需求,添加了很多高级功能和特性. 外文名 Tengine 发起单位 淘宝网 基 础 Nginx 目 ...
- modelsim(3) - summary ,issue,tips
1) the OEM of modelsim is 10 times slower than offical questa 2)how to the file full path in the mod ...
- java 枚举
DK1.5引入了新的类型——枚举.在 Java 中它虽然算个“小”功能,却给我的开发带来了“大”方便. 用法一:常量 在JDK1.5 之前,我们定义常量都是: publicstaticfianl... ...