|
導讀網(wǎng)頁的本質(zhì)就是超級文本標記語言，通過結合使用其他的Web技術（如：腳本語言、公共網(wǎng)關接口、組件等），可以創(chuàng)造出功能強大的網(wǎng)頁。因而，超級文本標記語言是萬維網(wǎng)（Web）編程的基礎，也就是說萬維網(wǎng)是建立... 網(wǎng)頁的本質(zhì)就是超級文本標記語言，通過結合使用其他的Web技術（如：腳本語言、公共網(wǎng)關接口、組件等），可以創(chuàng)造出功能強大的網(wǎng)頁。因而，超級文本標記語言是萬維網(wǎng)（Web）編程的基礎，也就是說萬維網(wǎng)是建立在超文本基礎之上的。超級文本標記語言之所以稱為超文本標記語言，是因為文本中包含了所謂“超級鏈接”點。 CSS中設置背景顏色的方式有很多，比如background-color，rgb，rgba等等，那你知道rgba，rgb和opacity之間的區(qū)別嗎？這篇文章就給大家講講rgba，rgb和opacity之間的區(qū)別，有一定的參考價值，感興趣的朋友可以參考一下。rgb和rgba的區(qū)別： rgb就是指紅色（red），綠色（green）、藍色（blue），取值在0到255之間，比如：黑色可以表示為rgb(0,0,0) rgba是指紅色（red），綠色（green）、藍色（blue），透明度（opacity），透明度的取值在0到1 之間 rgba和rgb的區(qū)別在于，rgba可以設置背景顏色的透明度，rgb不可以 舉例1：用 background: rgb(255,0,0)設置背景顏色為紅色 <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
.a1{
width: 300px;
height: 200px;
position: relative;
border: 1px solid black;
}
.a2{
width: 200px;
height: 100px;
position: absolute;
top: 50px;
left: 50px;
background: rgb(255,0,0);
}
</style>
</head>
<body>
<div class="a1"></div>
<div class="a2"></div>
</body>
</html>效果圖：
舉例2：用background: rgba(255,0,0,0.5)設置背景顏色為半透明紅色 .a1{
width: 300px;
height: 200px;
position: relative;
border: 1px solid black;
}
.a2{
width: 200px;
height: 100px;
position: absolute;
top: 50px;
left: 50px;
background: rgba(255,0,0,0.5);
}效果圖：
rgba()和opacity的區(qū)別： 兩者都可以設置透明效果，但是opacity屬性會作用于元素和元素里面的所有元素，比如子元素，rgba只會作用于它本身，不會作用于子元素上，具體區(qū)別請對比效果圖。 舉例3： 用opacity: 0.5設置透明度，代碼如下： <style type="text/css">
.a1{
width: 300px;
height: 200px;
position: relative;
border: 1px solid black;
}
.a2{
width: 200px;
height: 100px;
position: absolute;
top: 50px;
left: 50px;
background: red;
opacity: 0.5;
}
</style>
<body>
<div class="a1"></div>
<div class="a2">我是盒子里面的內(nèi)容，文字不需要透明</div>
</body>效果圖：
以上結合實例給大家介紹了rgba，rgb和opacity三者之間的區(qū)別，初學者可以自己動手嘗試，加深印象，希望這篇文章對你有所幫助！ 更多相關視頻教程請訪問 CSS教程 以上就是圖文詳解CSS中rgba，rgb和opacity之間的區(qū)別的詳細內(nèi)容，更多請關注php中文網(wǎng)其它相關文章！ 網(wǎng)站建設是一個廣義的術語，涵蓋了許多不同的技能和學科中所使用的生產(chǎn)和維護的網(wǎng)站。 |
溫馨提示：喜歡本站的話，請收藏一下本站！
本站發(fā)布的Win7純凈版系統(tǒng)、Win10純凈版和XP純凈版系統(tǒng)僅為個人學習測試使用，請在下載后24小時內(nèi)刪除，不得用于任何商業(yè)用途，否則后果自負，請支持購買微軟正版軟件！
本站所有資源全部來自于網(wǎng)絡資源,如侵犯到您的權益,請及時通知我們(peng896066052@126.com),我們會及時處理.
Copyright © 2018-2020 雨林木風下載站
