大家在敲代码的时候总会遇见一个问题。就是透明度opacity 会导致整个元素内全部都会改变，通常的方法是在同级元素后面再加上一个元素标签，但是现在有CSS3 ，我们完全不用这么做了。看代码

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>透明度的常见问题</title>
<style>
div{
width: 200px;
height: 100px;
text-align: center;
color: black;
/*background-color: red;*/
/*opacity: 0.3;*/
background-color: rgba(255,0,0,0.3);
}
</style>
</head>
<body>
<div><a>神奇的CSS3</a></div>
</body>
</html>

同时大家不必担心兼容问题，除了IE8以及以前的版本，其他都能很好的支持

CSS3的透明度使用的更多相关文章

  1. 【CSS3】透明度opacity与rgba()区别、光标cursor、display、轮廓outline与margin及border区别、em和rem区别

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  2. css3颜色+透明度渐变

    .linear { width: 630px; height: 120px; line-height: 150px; text-align: center; font-size: 26px; posi ...

  3. JavaScript - 基于CSS3动画的实现

    在痛苦的IE8时代,所有的动画都只能基于自己计算相关动画属性,开定时器setTimeout/setInterval轮询动画任务. 而肩负重任的HTML5,早已注意到了日益增强的动画,随着HTML5的降 ...

  4. CSS透明opacity和IE各版本透明度滤镜filter的最准确用法

    转载,原文见:http://blog.csdn.net/freshlover/article/details/17143341 CSS3的透明度属性opacity想必大家都已经用的无处不在了.而对于不 ...

  5. 初学html的单词笔记

    font-size: 文字大小color: 顏色solid: 边框线text-align: 間距center: 文字放在中間<head> 网页头部<title> 网页标题< ...

  6. CSS3 Filter详解（改变模糊度 亮度 透明度等方法）

    CSS3 Filter(滤镜)属性提供了提供模糊和改变元素颜色的功能.CSS3 Fitler 常用于调整图像的渲染.背景或边框显示效果. -webkit-filter是css3的一个属性,Webkit ...

  7. CSS3的颜色透明度 ajax请求时loading

    1.background-color:rgba(0,0,0,0.65)         这行代码让覆盖层变黑色,且有0.6的透明度 正常情况下遮盖层会把透明度遗传给弹出框(它的子元素),但是利用CSS ...

  8. CSS3集锦之新增选择器、圆角、阴影、透明度、transition动画、transform变形、animation动画

    ---恢复内容开始--- 一.CSS3新增选择器 1.nth-chlid(n)用法 selector:nth-chlid(n)指找到第n个子元素并且该元素为selector标签 <!DOCTYP ...

  9. CSS3:透明度

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

随机推荐

  1. C# 利用NPOI 实现Excel转html

    public void ExcelToHtml(string fileName, IWorkbook workbook) { ExcelToHtmlConverter excelToHtmlConve ...

  2. TAP/TUN摘要

    TUN适用于IP帧.Tap适用于以太网帧.TAP摸拟一个以太网设备(以arp广播MAC识别),它操作第二层数据包如以太网数据帧.TUN模拟了网络层ip设备(以点对点的方式,使用ip标识),操作第三层数 ...

  3. Security » Authorization » 基于视图的授权

    View Based Authorization¶ 基于视图的授权 44 of 46 people found this helpful Often a developer will want to ...

  4. oracle 的分析函数

    row_number() over(partition by ... order by ...) rank() over(partition by ... order by ...) dense_ra ...

  5. 从下往上看--新皮层资料的读后感 第三部分 70年前的逆向推演- 从NN到ANN

    第三部分 NN-ANN 70年前的逆向推演 从这部分开始,调整一下视角主要学习神经网络算法,将其与生物神经网络进行横向的比较,以窥探一二. 现在基于NN的AI应用几乎是满地都是,效果也不错,这种貌似神 ...

  6. 8bit YUV4：2：2格式对应的颜色

    红色:YCR YCB YCR YCB....分别为:51e6 515d 51e6 515d 绿色:YCR YCB YCR YCB....分别为:512b 513c 512b 513c 蓝色:YCR Y ...

  7. C#中timer类的用法

    C#中timer类的用法 关于C#中timer类  在C#里关于定时器类就有3个   1.定义在System.Windows.Forms里   2.定义在System.Threading.Timer类 ...

  8. Datafactory必须注意事项

  9. winform学习笔记02

    Hashtable 数据遍历的几种方式 ---Hashtable 在集合中称为键值对,它的每一个元素的类型是 DictionaryEntry,由于Hashtable对象的键和值都是Object类型,决 ...

  10. spark发行版笔记13

    本期概览: ReceiverTracker架构设计 消息循环系统 ReceiverTracker具体的实现 Spark Streaming作为Spark Core基础 架构之上的一个应用程序,其中的R ...