CSS RGBA和position屬性解釋

2022-08-02 07:45:14 字數 1352 閱讀 1542

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之間,不可為負值

其中第乙個數字(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,這裡只要是有小數點的透明度,都可以這樣簡寫。

一、body 

這句話的含義是:瀏覽器預設情況下,的寬度要與寬度小,所以需要這句話來消除邊距。

二、position:relative

首先,看一下官方對position的解釋:position這個屬性定義元素布局所用的定位機制。任何元素都可以定位,不過絕對或固定元素會生成乙個塊級框,

而不論該元素本身是什麼型別。相對定位元素會相對於它在正常流中的預設位置偏移。看不懂?那就先不看。

再來理解一下「文件流」「正常流」,

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

咱們的html的布局機制就是用文件流模型的,即塊元素(block)獨佔一行,內聯元素(inline)不獨佔一行。

簡言之:相對於自身預設的位置進行偏移。

三、position:absolute

absolute官方解釋為「生成絕對定位的元素,相對於static定位以外的第乙個父元素進行定位」。

首先認識一下static,static是position的預設值,它表示沒有定位,元素出現在正常的流中。

如果要使絕對定位absolute生效,必須指定left、right、top和bottom屬性中的至少乙個!

CSS的相對定位和絕對定位(position)

定位 position 故名思議,就是確定元素在頁面中的位置。css的常用定位有兩種,一種是相對定位,一種是絕對定位。下面我們看例子 id div0 id div1 id div2 有三個div,其中乙個大的 div0,裡面含有兩個子div,div1和 div2。可以看到,大的黃色 div0,巢狀了...

《CSS五》CSS中的定位型別position

未脫離文件流,即瀏覽器按照dom結構從上而下,從左而右對頁面進行渲染時,某元素按照順序出現在頁面中。脫離文件流,也就是將元素從普通的布局排版中拿走,其他盒子在定位的時候,會當做脫離文件流的元素不存在而進行定位。普通定位就是從上到下從左到右依次排布的布局。普通流中的元素的位置由元素在 x html 中...

和 區別和聯絡, 和 區別和聯絡

和 區別和聯絡,和 區別和聯絡,實際專案中,什麼情況用哪種?首先,和 的聯絡 共同點 和 都可以用作 邏輯與 運算子,都是雙目運算子。具體要看使用時的具體條件來決定。無論使用哪種運算子,對最終的運算結果都沒有影響。情況1 當上述的運算元是boolean型別變數時,和 都可以用作邏輯與運算子。情況2 ...