文章詳情頁
vue 如何設(shè)置背景顏色及透明度
瀏覽:86日期:2022-09-28 14:04:23
背景顏色及透明度設(shè)置
如上圖,如果是第一張圖片,需要在左上角加上灰色背景,白色“封面”字樣,背景色需要有透明度。
首先,需要知道rgba() 函數(shù)。
rgba() 函數(shù)使用紅(R)、綠(G)、藍(lán)(B)、透明度(A)的疊加來生成各式各樣的顏色。
RGBA 即紅色、綠色、藍(lán)色、透明度(英語:Red, Green, Blue、Alpha)。
紅色(R)0 到 255 間的整數(shù),代表顏色中的紅色成分。。 綠色(G)0 到 255 間的整數(shù),代表顏色中的綠色成分。 藍(lán)色(B)0 到 255 間的整數(shù),代表顏色中的藍(lán)色成分。 透明度(A)取值 0~1 之間, 代表透明度。數(shù)值越小,透明度越高。下面上vue代碼:
首先設(shè)置父級(jí)元素位置position: relative;然后設(shè)置子元素位置position: absolute;通過設(shè)置left、right、top、bottom來調(diào)整位置,然后設(shè)置背景色background:rgba(34,34,34,0.5);
在設(shè)置樣式時(shí)使用
background-color: unset
3.1.0 是設(shè)置了背景色的
登錄是沒有設(shè)置背景色的
以上為個(gè)人經(jīng)驗(yàn),希望能給大家一個(gè)參考,也希望大家多多支持好吧啦網(wǎng)。
標(biāo)簽:
Vue
相關(guān)文章:
1. XML入門精解之結(jié)構(gòu)與語法2. ASP刪除img標(biāo)簽的style屬性只保留src的正則函數(shù)3. Echarts自定義圖形的方法參考4. ASP動(dòng)態(tài)網(wǎng)頁制作技術(shù)經(jīng)驗(yàn)分享5. Xml簡(jiǎn)介_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理6. ASP基礎(chǔ)入門第二篇(ASP基礎(chǔ)知識(shí))7. CSS可以做的幾個(gè)令你嘆為觀止的實(shí)例分享8. ASP實(shí)現(xiàn)加法驗(yàn)證碼9. 解析原生JS getComputedStyle10. css代碼優(yōu)化的12個(gè)技巧
排行榜
