文章詳情頁
vue 如何設(shè)置背景顏色及透明度
瀏覽:75日期:2022-09-28 14:04:23
背景顏色及透明度設(shè)置
如上圖,如果是第一張圖片,需要在左上角加上灰色背景,白色“封面”字樣,背景色需要有透明度。
首先,需要知道rgba() 函數(shù)。
rgba() 函數(shù)使用紅(R)、綠(G)、藍(B)、透明度(A)的疊加來生成各式各樣的顏色。
RGBA 即紅色、綠色、藍色、透明度(英語:Red, Green, Blue、Alpha)。
紅色(R)0 到 255 間的整數(shù),代表顏色中的紅色成分。。 綠色(G)0 到 255 間的整數(shù),代表顏色中的綠色成分。 藍色(B)0 到 255 間的整數(shù),代表顏色中的藍色成分。 透明度(A)取值 0~1 之間, 代表透明度。數(shù)值越小,透明度越高。下面上vue代碼:
首先設(shè)置父級元素位置position: relative;然后設(shè)置子元素位置position: absolute;通過設(shè)置left、right、top、bottom來調(diào)整位置,然后設(shè)置背景色background:rgba(34,34,34,0.5);
在設(shè)置樣式時使用
background-color: unset
3.1.0 是設(shè)置了背景色的
登錄是沒有設(shè)置背景色的
以上為個人經(jīng)驗,希望能給大家一個參考,也希望大家多多支持好吧啦網(wǎng)。
標簽:
Vue
相關(guān)文章:
1. html中的form不提交(排除)某些input 原創(chuàng)2. ASP動態(tài)網(wǎng)頁制作技術(shù)經(jīng)驗分享3. ASP常用日期格式化函數(shù) FormatDate()4. CSS3實現(xiàn)動態(tài)翻牌效果 仿百度貼吧3D翻牌一次動畫特效5. asp.net core項目授權(quán)流程詳解6. XMLHTTP資料7. vue使用moment如何將時間戳轉(zhuǎn)為標準日期時間格式8. CSS3中Transition屬性詳解以及示例分享9. jsp文件下載功能實現(xiàn)代碼10. 開發(fā)效率翻倍的Web API使用技巧
排行榜
