背景颜色、字体等的不透明区别 （opacity、transparent以及rgba的区别）
背景颜色、字体等的不透明区别 （opacity、transparent以及rgba的区别 ）
- opacity
- transparent
- rgba
- 1. 继承问题：
opacity
不透明度。
取值为0.1～1.0之间，0.0 （完全透明） ， 1.0 （完全不透明）
语法：
img {width: 100px;height: 200px;opacity ：0.5;
}
opacity : 属于一个完整属性出现，对于整个元素起作用。可以被其子元素继承，给父级div设置opacity属性，那么所有子元素都会继承这个属性。
可设置背景图的透明程度：
效果如下：
transparent
transparent ：属性颜色的一种，叫做透明度
哪个属性给transparent 哪个就透明
img {width: 100px;height: 200px;backgroun-color : transparent;
}
可以利用transparent 让border 来进行三角形等制作。如底部正三角形、倒三角形，左侧三角形、右侧三角形等，但是需要把宽高都设置为 0。如下图：
如果加上宽高，则会得出不同形状的矩形：
效果如下：
rgba
r ：红 g ：绿 b： 蓝。三个颜色的叠加成最终颜色
a ： 表示元素不透明的值。取值0-1 之间，0表示完全透明， 1 表示 完全不透明
特点：与transparent 的属性一样，都是以属性值出现，对于某个元素的某个属性起作用。rgba 可以在单个元素上设置透明度，而不影响其子元素.
任何需要设置颜色的地方，都可以设置transparent 和 rgb 。如 背景、边框、字体等效果。
div {width: 500px;height: 400px;background-color:rgba(0, 0, 0, 0.3);/* 设置半透明 */
效果如下:
两个颜色有一个颜色设计半透明后，叠加部分出现第三种颜色。
1. 继承问题：
如一个元素未设置opacity 属性，它就会从父元素继承opacity 的值，而alpha不存在继承。
背景颜色、字体等的不透明区别 （opacity、transparent以及rgba的区别）相关推荐
- echo -e “\033[字背景颜色 字体颜色m字符串\033[0m“解释
格式: echo -e "\033[字背景颜色 字体颜色m字符串\033[0m" 字背景颜色范围:40----49 40:黑 41:深红 42:绿 43:黄色 44:蓝色 45:紫 ...
- 格式: echo -e \033[字背景颜色 字体颜色m字符串\033[0m
转自:http://blog.csdn.net/panpan639944806/article/details/23930553 格式: echo -e "\033[字背景颜色;字体颜色m字 ...
- 格式: echo -e \033[字背景颜色;字体颜色m字符串\033[0m
格式: echo -e "\033[字背景颜色;字体颜色m字符串\033[0m" 例如: echo -e "\033[41;36m something here \03 ...
- Excel 自定义函数按单元格背景颜色/字体颜色实现计数或求和
Excel 自定义函数按单元格背景颜色/字体颜色实现计数或求和 https://download.csdn.net/download/sea1_2/34881468
- opacity、transparent以及rgba的区别
简单总结下opacity.transparent以及rgba 这几个概念最开始学的时候只是有个大致印象,现在复习这部分的知识点,发现不仔细区分一下,还真有点混乱. 三者共同点是都和透明有关.先分着来说 ...
- muse ui tabs背景颜色字体颜色
.mu-tabs背景颜色 .mu-tab-link 字体颜色 转载于:https://www.cnblogs.com/caohongwu/p/8819466.html
- PyCharm的配置(背景颜色+字体大小+行号+解释器选择等)
我的第二篇博客,上一篇是PyCharm安装过程,下面讲解PyCharm的配置. 第一:配置PyCharm的背景 打开PyCharm开发环境,使用快捷键Ctrl + "`"(该键位于 ...
- uniapp 微信小程序 导航栏设置背景颜色字体颜色
{"path": "pages/company","style":{"navigationBarTitleText": ...
- 基础复习——TextView——文本显示——字体颜色——背景颜色——字体大小——@color/teal_200——@string/hello...
文本显示 布局: <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"androi ...
- Shell 显示带颜色字体
格式: echo "/033[字背景颜色;字体颜色m字符串/033[控制码" 如果单纯显示字体颜色可以固定控制码位0m. 格式: echo "/033[字背景颜色;字体颜 ...
最新文章
- UNL/EVE关联putty和wireshark
- GPRS的工作原理、主要特点
- 按钮开始多线程_微软MR技术专家分享：AR/VR多线程处理的八年经验与技巧
- 九度OJ 1076：N的阶乘 （数字特性、大数运算）
- 类中构造函数、析构函数与赋值函数的重写
- AutoCompleteTextView 和 TextWatcher 详解
- DEDE常见的错误（转）
- 吉林大学计算机网络考研知识点整理
- 计算机键盘和指法练习实验报告模板,实验报告-实验一 计算机的认识与指法练习...
- 联想lenovo G40-70M 无线网卡白名单跳过
- CAN报文解析SIGNAL的C语言实现
- 【IT职业】IT人的职业规划
- 一个“编码十几年”的『老程序员』分享的四点心得
- matlab处理各种数据、文件
- Age Estimation
- Java EasyPoi简单报表+复合表头报表的导出
- 【安卓Framework学习】Wifi框架学习之核心类
- 6.easyui+ztree案例：zTree树
- 《HTML5+CSS3网页布局和样式精粹》.(张亚飞).[PDF]ckook
- Oracle打补丁步骤