zoukankan      html  css  js  c++  java
  • CSS---RGBA和position属性解释

    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属性中的至少一个!

  • 相关阅读:
    数据存储之iOS断点续传
    使用MVC4,Ninject,EF,Moq,构建一个真实的应用电子商务SportsStore(十一)
    使用MVC4,Ninject,EF,Moq,构建一个真实的应用电子商务SportsStore(十)
    使用MVC4,Ninject,EF,Moq,构建一个真实的应用电子商务SportsStore(九)
    获取当前页面url中的参数 coffeescript+node.js+angular
    自定义异步线程池工具,用于执行异步方法
    @ComponentScan 扫包 @Import添加组件
    properties解决中文乱码
    Spring Cloud Config配置中心(五)
    Spring Cloud Zuul路由转发(四)
  • 原文地址:https://www.cnblogs.com/rainbow-1/p/14599663.html
Copyright © 2011-2022 走看看