一般情况下,我们可以使用css的opcity属性改变某个元素的透明度,但是其元素下的子元素的透明度也会被改变,即使对子元素重新定义也没有用,例如:

  1. <div style="opacity:0.4; background-image:url(...);">
  2. <div style="opacity:1.0;">
  3. 显示文字
  4. </div>
  5. </div>

文字元素的透明度也会是0.4。

于是想一想,如果有方法只改变背景的透明度就能解决此问题了。

方法1:使用一张透明的图片做背景可以达成效果,但是有没有更简单的方法呢?

方法2:使用RGBA。

例如:

  1. <div style="0, 0, 0.4)">
  2. <div>
  3. 显示文字
  4. </div>
  5. </div>

CSS只改变背景透明度,不改变子元素透明度的更多相关文章

  1. css 只改变父元素的透明度,不改变子元素透明度rgba+opacity

    给元素加透明度时,通常写法为:opacity:0.5,filter:alpha(opacity=50); 我们通常也会遇到,在给父元素背景设置透明度时,子元素内容继承了父元素的透明度. 如何让子元素脱 ...

  2. css只改变input输入框光标颜色不改变文字颜色实现方法

    input:focus{color:blue}//光标颜色 input{ text-shadow: 0px 0px 0px red;//文字颜色 -webkit-text-fill-color: tr ...

  3. 巧用hover改变css样式和背景

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. 6-Qt给父widget加上styleSheet(添加背景图)而不改变子widget的styleSheet的方法

    Qt给父widget加上styleSheet(添加背景图)而不改变子widget的styleSheet的方法 比如用stylesheet给widget加背景图,可以用qt designer修改ui文件 ...

  5. Jquery_HTML-对HTML内容删除添加、操作CSS改变样式、遍历定位元素

    1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="U ...

  6. CSS总结 最后的选择符和字体、元素常见样式

    在伪类选择符中,还有很多,其中比较有意思的是E:target 当我们想做出点击超链接后链接变色且其他链接变回原来的颜色时,就可以用到这个选择符 <a href="#a1" i ...

  7. {前端CSS} 语法 Css的几种引入方式 css选择器 选择器的优先级 CSS属性相关 背景属性 边框 CSS盒子模型 清除浮动 overflow溢出属性  定位(position)z-index

    前端CSS CSS介绍 CSS(Cascading Style Sheet,层叠样式表)定义如何显示HTML元素,给HTML设置样式,让它更加美观. 当浏览器读到一个样式表,它就会按照这个样式表来对文 ...

  8. 使用 CSS MARK 改变 SVG 背景色

    CSS masks -webkit-mask 这个属性是相当强大的,详细的介绍请到这里查看,它非常值得深入研究. -webkit-mask 让为一个元素添加蒙板成为可能,从而你可以创建任意形状的花样. ...

  9. CSS Backgrounds(背景)

    CSS Backgrounds(背景) CSS 背景属性用于定义HTML元素的背景. CSS 属性定义背景效果: background-color background-image backgroun ...

随机推荐

  1. *** error 65: access violation at C:0x001B : no 'execute/read' permission

    转自:http://blog.csdn.net/chenqiai0/article/details/7827071 很多人在进行串口调试的时候会遇到这个问题,请大家略看我的代码,解决方法在其中 //实 ...

  2. exFAT移动硬盘写保护怎么去掉

    cmd命令提示符下运行chkdsk命令: 比如在E盘,则输入的命令如下: E:(冒号不可少,输入后回车) CHKDSK /F /X  (回车) 等命令执行完了,即可去掉exFAT移动硬盘写的保护.

  3. windows多线程(五) 互斥量 Mutex

    一.互斥量 互斥量是windows的一个内核对象,互斥量与关键段的作用相似,可以用来确保全局资源的互斥访问.并且互斥量可以用在不同的进程中的线程互斥访问全局资源. 二.相关函数说明 使用互斥量Mute ...

  4. dedecms 织梦本地调试 后台反映非常慢的处理办法

    最近需要做几个企业站,所以呢,考虑了一下,没有用phpcms,而选择了 织梦.毕竟么,织梦用来做企业站还是比较合适的.好了,进正题: 在本地调试的时候,会非常的卡顿.调试的方法如下: 安装目录/dat ...

  5. 如何处理UIVIew addsubview 不显示subview

    老代码: addsubview不显示uilabel -(UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSIn ...

  6. matplotlib + pandas绘图

    利用pandas处理日期数据,并根据日期绘制增长率曲线. 处理的json文本内容如下: # pd.json [{"name": "A", "date& ...

  7. Fortinet Security Fabric

    Fortinet Security Fabric 这个世界从不固步自封.在技术方面,这意味着解决方案供应商必须保持不断创新和探索才能实现生存与发展. 在网络安全领域,这更是至理名言.许多黑客都是才华横 ...

  8. win10远程连接

    提示凭证不工作问题 https://blog.csdn.net/sinat_25926481/article/details/50775616

  9. String,static,final

    1. String 下面代码创建了几个对象? String s1 = new String("Hello"); String s2 = new String("Hello ...

  10. JavaWeb中的多数据源开发

    从我们接触Javaweb开始,ssh框架或者ssm等或许是惊叹于框架的强大之处还是自身的迷茫,一直没有注意到一个问题就是:在我的项目中在spring中所配置的数据源都是指向单一数据库,都是单数据源,一 ...