設定div背景透明的方法
div背景透明常見的有兩種方法：
1. 通過opacity屬性設定，取值0~1,0表示透明，1表示不透明，但是這種方法會把div上的內容也同時進行透明設定，
效果如下：
2.通過rgba格式的background-color設定，格式為：background-color:rgba(0,0,0,0~1)，0表示透明，1表示不透明，
代碼如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.id{
width: 600px;
height: 300px;
}
.tm1{
margin: 40 auto;
text-align: center;
line-height: 200px;
width: 800px;
height: 200px;
background-color: yellow;
opacity: 0.6;
}
.tm2{
margin: 40 auto;
text-align: center;
line-height: 200px;
width: 800px;
height: 200px;
background-color: rgba(255, 255, 0, 0.5);
}
</style>
</head>
<body>
<!--背景div-->
<div class="id">
<!--透明div方法一-->
<div class="tm1">透明div方法一,通過opacity設定透明度，div上的文字也透明：opacity: 0.6;</div><br>
<!--透明div方法二-->
<div class="tm2">透明div方法二,通過rgba設定透明度,div上面的文字不透明：background-color:rgba(255,0,0,0.5);</div>
</div>
</body>
</html>
這里還有一點要注意的:
rgba() 函式使用紅?、綠(G)、藍(B)、透明度(A)的疊加來生成各式各樣的顏色，
RGBA 即紅色、綠色、藍色、透明度（英語：Red, Green, Blue、Alpha），
紅色（R）0 到 255 間的整數，代表顏色中的紅色成分，，
綠色（G）0 到 255 間的整數，代表顏色中的綠色成分，
藍色（B）0 到 255 間的整數，代表顏色中的藍色成分，
透明度（A）取值 0~1 之間， 代表透明度，
可以百度百科查找rgba值.
類似于:
顏色碼對照表鏈接:
https://www.sioe.cn/yingyong/yanse-rgb-16/
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/253007.html
標籤：其他
上一篇：賽后題解——真偽亞瑟王