rgb与rgba的含义

RGB 是代表Red(红色) 、Green(绿色)、 Blue(蓝色)三个单词的缩写。

RGBA 颜色值是 RGB 颜色值的扩展,添加了一个 alpha 通道, 它规定了对象的不透明度。

1、 基本语法:
R:红色值。 正整数(0~255)或 百分数(0.0% - 100.0%)
G:绿色值。 正整数(0~255)或 百分数(0.0% - 100.0%)
B:蓝色值。 正整数(0~255)或 百分数(0.0% - 100.0%)
A:透明度。取值0~1之间,不可为负值

rgb的书写格式:rgb(90,50,25);

其中第一个数字(90)表示Red 颜色(红色值),第二个数字(50)表示Green 颜色(绿色值),

第三个数字(25)表示Blue 颜色(蓝色值)。数字越大(不超过255)则表示其对应的颜色加的越多。

rgba的书写格式:rgba(90,50,25,0.5);

从上面我们可以得到 RGBA 颜色值是 RGB 颜色值的扩展,添加了一个 alpha 通道,

它规定了对象的不透明度。

前面三个数值跟 rgb表示的是一样的,a 的值为0~1之间的值,0表示透明色,1表示不透明,

0.5表示每个(R、G、B)颜色50%的透明度,

也就是每个颜色半透明状态。这里的a还可以简写成 .5,这里只要是有小数点的透明度,都可以这样简写。


先放上原文链接:https://blog.csdn.net/mybelief321/article/details/50211801

一、body{margin: 0; padding: 0;}

这句话的含义是:浏览器默认情况下,<body>的宽度要与<html>宽度小,所以需要这句话来消除边距。

二、position:relative

首先,看一下官方对position的解释:position这个属性定义元素布局所用的定位机制。任何元素都可以定位,不过绝对或固定元素会生成一个块级框,

而不论该元素本身是什么类型。相对定位元素会相对于它在正常流中的默认位置偏移。看不懂?那就先不看。

再来理解一下“文档流”“正常流”,

百度百科是这样解释“文档流”:将窗体自上而下分成一行行,并在每行中按从左至右的顺序排放元素,即为文档流(自己的理解是从头到尾按照文档的顺序,

该在什么位置就在什么位置,也可以按照上面的意思理解,自上而下,自左到右的顺序)。

咱们的HTML的布局机制就是用文档流模型的,即块元素(block)独占一行,内联元素(inline)不独占一行。

简言之:相对于自身默认的位置进行偏移。

三、position:absolute

absolute官方解释为“生成绝对定位的元素,相对于static定位以外的第一个父元素进行定位”。

首先认识一下static,static是position的默认值,它表示没有定位,元素出现在正常的流中。

如果要使绝对定位absolute生效,必须指定left、right、top和bottom属性中的至少一个!

CSS---RGBA和position属性解释的更多相关文章

  1. Css中的Position属性

    Css中的Position属性 Css属性在线查询地址: http://www.css88.com/book/css/properties/index.htm CSS 中的 position 属性 在 ...

  2. DIV CSS布局中position属性用法深入探究

    本文向大家描述一下DIV CSS布局中的position属性的用法,position属性主要有四种属性值,任何元素的默认position的属性值均是static,静态.这节课主要讲讲relative( ...

  3. 细说css中的position属性

    有过css开发经验的同学,对于position这个属性一定不会陌生,然而这个熟悉的属性确是面试题中的常客,也就说明了该属性在css的世界是有一定的江湖地位的,那么我们就来详细的说说position这个 ...

  4. css中的position属性值的探究

    css的position属性指定了元素的定位类型,然后通过top,botton,left,right来具体定位. 在具体定位之前必须使用position属性,否则所有的具体定位属性都无法生效. pos ...

  5. css中关于position属性的探究(原创)

    关于position属性的设置,头脑中一直觉得不是很清楚,所以借助这次机会单独自己测试了一下,记作学习笔记.   首先,css的position属性包含下面四种设置情况: static:默认属性.指定 ...

  6. 详解css中的position属性

    这一次直接进入主题. css中最常用的布局类属性,一个是float,另一个就是定位属性position. 对于position来讲,有以下属性值: static : 无特殊定位,对象处于正常文档流.其 ...

  7. 对CSS中的Position属性的一些深入探讨

    转:http://www.cnblogs.com/coffeedeveloper/p/3145790.html Position属性 Position的属性值共有四个static.relative.a ...

  8. 浅谈css中的position属性

    我觉得吧,css如果不考虑浏览器的兼容问题的话,最让人头疼的应该就是position了,反正我是这么觉得的,为了能基本上搞清楚position的几种情况,我找了一些资料,做了一个小实验,下面是实验的过 ...

  9. 【CSS学习】--- position属性

    一.前言 1.HTML中的三种布局方式: 标准流(普通流):网页中默认的布局方式,即顺序布局 浮动:float 定位:position 2.position属性的作用方式: 给position属性设置 ...

  10. 理解css中的position属性

    理解css中的position 两种类型的定位 static类型:只有一个值position: static.position默认值 relative类型:包括三个值,这三个值会相互影响,允许你以特定 ...

随机推荐

  1. win32 - EnumDisplayDevices和EnumDisplayMonitors的使用

    EnumDisplayDevices枚举适配器 EnumDisplayMonitors枚举监视器 #pragma comment(lib, "dxva2.lib") #includ ...

  2. 【Android 逆向】看雪题目:找出flag 如果输入正确则屏幕上的 hello会变成success

    1. apk 安装到手机,只有一个输入框,随便输入点什么,提示error 2. apk拖入到jadx中 public class MainActivity extends AppCompatActiv ...

  3. Vulnhub内网渗透DC-7靶场通关

    个人博客: xzajyjs.cn DC系列共9个靶场,本次来试玩一下一个 DC-7,下载地址. 下载下来后是 .ova 格式,建议使用vitualbox进行搭建,vmware可能存在兼容性问题.靶场推 ...

  4. 【Azure 应用服务】App Service中抓取 Web Job 的 DUMP 办法

    问题描述 使用Azure App Service,也可以部署一个Java程序作为Web Job运行.运行一个 .Jar 文件只需要以下4步: 1)把Java应用打包成一个 .jar 文件 2)创建一个 ...

  5. 从 HPC 到 AI:探索文件系统的发展及性能评估

    随着 AI 技术的迅速发展,模型规模和复杂度以及待处理数据量都在急剧上升,这些趋势使得高性能计算(HPC)变得越来越必要.HPC 通过集成强大的计算资源,比如 GPU 和 CPU 集群,提供了处理和分 ...

  6. 2、dubbo原理

    图例说明: 图中左边淡蓝背景的为服务消费方使用的接口,右边淡绿色背景的为服务提供方使用的接口,位于中轴线上的为双方都用到的接口. 图中从下至上分为十层,各层均为单向依赖,右边的黑色箭头代表层之间的依赖 ...

  7. Excel去除表格密码保护

    表格受密码保护时,我们修改数据Excel弹出"您试图更改的单元格或图表受保护,因而是只读的.若要修改受保护单元格或图表,请先使用'撤消工作表保护'命令(在'审阅'选项卡的'更改'组中)来取消 ...

  8. [学习笔记].Net5项目打包到Linux系统服务时遇到的坑

    ​如果按照官方文档的步骤手动安装.Net5 会有一个坑: 在 Linux 上手动安装 .NET - .NET | Microsoft Docs 在使用systemd打包.Net5服务的时候,无法运行, ...

  9. Template String Converter - 字符串中加变量 自动将单引号变换 - vscode插件

    Template String Converter - 字符串中加变量 自动将单引号变换 - vscode插件

  10. 音标 舌侧音 /l/ 的发音 - 英语

    音标 舌侧音 /l/ 的发音 这个音标 首先确定下 就是一个音 发 了(注意 发音方式不是中文的了,是英文的了) 注意发音方式很重要 中文 '了',重点在 偏鼻音(发射方向为前上方) 英文 '了',重 ...