背景半透明，子元素不透明的效果经常需要用到。通常对父容器使用opacity属性时，子元素也跟着变透明，所以不妨设置父容器的

background-color:rgba(r,g,b,x);

其中x取值从0到1，表示透明程度。

父容器利用opacity设置透明后，子元素跟着变透明的解决方案的更多相关文章

  1. 【IE6的疯狂之十】父级使用padding后子元素绝对定位的BUG

    在前端开发中,经常会用到css的position:absolute来使层浮动,前通过left,top,right等属性来对层进行定位,但ie6对left,top,right等属性的解释和ie7,ie8 ...

  2. winform子容器随父容器的变化设置

    在设计winform窗体时,因为会很少去调整窗体的大小,这时子控件就会出很尴尬的情况, 通过查看空间的属性,发现有这样两个属性,dock和anchor.这里主要说anchor,官方 解释没太看懂,我的 ...

  3. 使用RGBa和Filter实现不影响子元素的CSS透明背景

    点击查看原文 问题 如果我们想要一个元素拥有半透明的背景,我们有两个选择: 使用CSS和 opacity 做一张 24-bit PNG 背景图片 在CSS中使用opacity有两个问题,一是为了适应所 ...

  4. 利用 :first-child 和 :nth-last-child 确定子元素数目

    读<css揭秘>时,发现选择器的神奇作用,可以确定子元素数目,比如: li:first-child:nth-last-child(2),li:first-child:nth-last-ch ...

  5. BootStrap 实现导航栏nav透明，nav子元素文字不透明

    在给nav 的属性赋值 opacity:0.0透明度时会导致nav内子元素会继承opacity属性.此时再对子元素赋值opacity:1.0 时会导致 子元素实际opacity值为0.0*1.0=0. ...

  6. 用node.js express设置路径后 子路径下的页面访问静态资源路径出问题

    在routes/news_mian.js 设置了访问news_main.html 的路径 '/',通知设置一个访问news-page.html的子路径'/newspage'子路径.但是在访问loacl ...

  7. IOS 设置视图半透明子控件不透明

    代码处理: UIColor *color = [[UIColor blackColor] colorWithAlphaComponent:0.6]; self.view.backgroundColor ...

  8. chrome 49 版本bug: flex父元素设置flex:1 , 子元素用height:100%无法充满父元素

    1 <div class="container"> <div class="item"> <div class="ite ...

  9. angular 中父元素ng-repeat后子元素ng-click失效

    在angular中使用ng-repeat后ng-click失效,今天在这个上面踩坑了.特此记录一下. 因为ng-repeat创造了新的SCOPE.如果要使用这个scope的话就必须使用$parent来 ...

随机推荐

  1. 使用nodemailer发送邮件

    今天闲来无事,一时兴起看了下如果使用javascript来发送邮件.经过调研发现,nodeJs可以实现这个功能. 具体的步骤如下: 1.安装依赖 npm install nodemailer -g ( ...

  2. 分页实现：Offset-Fetch

    SQL Server 2012 新增 Offset-Fetch子句,用于从有序结果集中,跳过一定数量的数据行,获取指定数量的数据行,从而达到分页的目的.经过测试,在分页查询上,从逻辑读取数和响应时间来 ...

  3. 【Win 10 应用开发】UDP广播

    我们知道,对于UDP协议的通信,除了可以用来聊天外,可以发送广播数据.只要向广播地址的某个端口发送数据就可以进行广播,子网中只要监听该端口的socket就能收到广播消息. 最简单的方法就是向255.2 ...

  4. .NET Core采用的全新配置系统[4]: “Options模式”下各种类型的Options对象是如何绑定的？

    旨在生成Options对象的配置绑定实现在IConfiguration接口的扩展方法Bind上.配置绑定的目标类型可以是一个简单的基元类型,也可以是一个自定义数据类型,还可以是一个数组.集合或者字典类 ...

  5. ASP.NET MVC 5调用其他Action

    引用代码: @Html.Action("Index", "BaseData", new { d = "variety" }) 后台获取参数: ...

  6. 用CIL写程序:定义一个叫“慕容小匹夫”的类

    前文回顾: <用CIL写程序:你好,沃尔德> <用CIL写程序:写个函数做加法> 前言: 今天是乙未羊年的第一天,小匹夫先在这里给各位看官拜个年了.不知道各位看官是否和匹夫一样 ...

  7. js的命名规范

                   js的命名规范   1.驼峰命名法:首字母是小写的,接下来的字母都以大写字符开头.例如: var testValue = 0; var oneValue = 10; 2. ...

  8. Delphi_02_Delphi程序的结构

    一.工程文件 program MultiUnit; {$APPTYPE CONSOLE} uses SysUtils, Unit1 in 'Unit1.pas'; begin //引用unit1中的变 ...

  9. PHP 装饰器模式

    装饰器模式:是在不必改变原类文件和使用继承的情况下,动态地扩展一个对象的功能. [装饰器模式中主要角色] 抽象组件角色(Component):定义一个对象接口,以规范准备接受附加责任的对象,即可以给这 ...

  10. java web学习总结(二十九) -------------------JavaBean的两种开发模式

    SUN公司推出JSP技术后,同时也推荐了两种web应用程序的开发模式,一种是JSP+JavaBean模式,一种是Servlet+JSP+JavaBean模式. 一.JSP+JavaBean开发模式 1 ...