问题:给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子元素的字体会抖一下的更多相关文章

  1. 设置background属性使用selector的时候内置?attr报错的解决方案

    当我们设置background属性的时候可以设置background="@color/black" 也可以设置 background="@drawable/selecto ...

  2. div样式text-align在子元素缩进不规范的情况下,chrome出现的问题(貌似结果是inline-block导致的)

    在调css的时候,发现居然有firefox实现效果完整而chrome出现问题的情况: 详细情况:segmentfault1 segmentfault2 全文表达: <html><he ...

  3. div鼠标悬停,子元素上移,鼠标移出,子元素下移动画。

    HTML: <div class="edt_title" > <div id="edt_title"> <p class=&quo ...

  4. 父元素设置min-height子元素设置100%问题

    问题:父元素设置min-height子元素高度设置100%取不到值,这是因为子元素 div设置 height:100%: 只有当父级元素满足min-height:1000px;设置的条件才触发: 浏览 ...

  5. CSS关于子元素设置了float属性后父元素高度为0的解释和解决方法

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...

  6. 第4天:JS入门-给div设置宽高背景色

    今天学习了js入门课程,听的不多,做了个小练习,给div设置宽高.背景色.一点点都是进步.核心代码如下: <!DOCTYPE html><html lang="en&quo ...

  7. 【html/css】若母div设置了透明度,如何才能使得里面的子div不继承母div的透明度

    用rgba的方式给母div设置透明度的话就不会影响子div的透明度了. 例: background: rgba(51, 51, 51, 0.5);

  8. position:absolute 按钮左右分布:left:0 和 right:0 以及雪碧图

    问题:把两个a标签按钮 垂直居中,并且分别把两个按钮放在水平左右两边顶部1,祖父元素设定:position:relative2,把.arrow 设定上下垂直居中 position:absolute; ...

  9. 子DIV设置margin-top影响父DIV位置的解决办法

    父div如果没有任何东西,子div设置margin-top,父div会下落 <!DOCTYPE html> <html lang="en"> <hea ...

随机推荐

  1. python3网络爬虫笔记

    参考资料 Python官方文档 知乎相关资料(1) 这篇非常好, 通俗易懂的总览整个Python学习框架. 知乎相关资料(2) 代码实现(一): 用Python抓取指定页面 #!/usr/bin/en ...

  2. jQuery.ajax()调用asp.net后台方法

    利用JQuery的$.ajax()可以很方便的调用asp.net的后台方法.介意方法名不要重名 建一个WebFormAjax名aspx文件 CS <%@ Page Language=" ...

  3. Python之RabbitMQ操作

    RabbitMQ是一个消息代理,从“生产者”接收消息并传递消息至“消费者”,期间可根据规则路由.缓存.持久化消息.“生产者”也即message发送者以下简称P,相对应的“消费者”乃message接收者 ...

  4. Java的版本分类

    J2EE (JavaEE)Java2 Enterprise Edition定位在服务器端的应用 J2SE(JavaSE)Java2 Standard Edition定位在个人计算机上的应用 J2ME( ...

  5. 通过SQL Server 2008数据库复制实现数据库同步备份

    SQL Server 2008数据库复制是通过发布/订阅的机制进行多台服务器之间的数据同步,我们把它用于数据库的同步备份.这里的同步备份指的是备份服务器与主服务器进行 实时数据同步,正常情况下只使用主 ...

  6. java的继承和重写

    继承是面向对象最显著的一个特性.继承是从已有的类中派生出新的类,新的类能吸收已有类的数据属性和行为,并能扩展新的能力.[1]  Java继承是使用已存在的类的定义作为基础建立新类的技术,新类的定义可以 ...

  7. 免费而优秀的图表JS插件

    1.百度的Echart ECharts,缩写来自Enterprise Charts,是百度推出的一款开源的,商业级数据图表,它最初是为了满足百度公司商业体系里各种业务系统(如凤巢.广告管家等等)的报表 ...

  8. VMware 虚拟机桥接网络设置

    一.桥接的基本原理    配置成桥接网络连接模式的虚拟机就当作主机所在以太网的一部分,虚拟系统和宿主机器的关系,就像连接在同一个Hub上的两台电脑,可以像主机一样可以访问以太网中的所有共享资源和网络连 ...

  9. {POJ}{3897}{Maze Stretching}{二分答案+BFS}

    题意:给定迷宫,可以更改高度比,问如何使最短路等于输入数据. 思路:由于是单调的,可以用二分答案,然后BFS验证.这里用优先队列,每次压入也要进行检查(dis大小)防止数据过多,A*也可以.好久不写图 ...

  10. 用VC进行COM编程所必须掌握的理论知识

    一.为什么要用COM 软件工程发展到今天,从一开始的结构化编程,到面向对象编程,再到现在的COM编程,目标只有一个,就是希望软件能象积方块一样是累起来的,是组装起来的,而不是一点点编出来的.结构化编程 ...