今天就跟大家聊聊有關(guān)CSS3的RGBA中關(guān)于整數(shù)和百分比值的轉(zhuǎn)換的示例分析，可能很多人都不太了解，為了讓大家更加了解，小編給大家總結(jié)了以下內(nèi)容，希望大家根據(jù)這篇文章可以有所收獲。

創(chuàng)新新互聯(lián)，憑借10多年的成都網(wǎng)站設(shè)計、網(wǎng)站制作經(jīng)驗，本著真心·誠心服務(wù)的企業(yè)理念服務(wù)于成都中小企業(yè)設(shè)計網(wǎng)站有1000多家案例。做網(wǎng)站建設(shè)，選創(chuàng)新互聯(lián)建站。

如何把整數(shù)轉(zhuǎn)換為百分數(shù)

前面提到了，使用百分數(shù)值代替整數(shù)值來表示紅、綠、藍三原色的量，最后得到的結(jié)果是相同的。0代表0%，255就表示100%。為了讓百分數(shù)等值，你只需要讓整數(shù)值除以255然后乘以100%就可以了。

上面的例子中，如果RGBA色彩值是rgba（255,242,0,0.5），那么

CSS 

1.     Red: (255/255) x 100% = 100%   

2.     Green: (242/255) x 100% = 94.9%   

3.     Blue: (0/255) x 100% = 0%   

4.     Alpha: 0.5   

5.   

6. color: rgba(100%, 94.9%, 0%, 0.5);  

結(jié)果:

如何把百分數(shù)轉(zhuǎn)換為整數(shù)

其實只要把上面的倒過來即可，即把百分比數(shù)值乘以255，再乘以100%（即乘以255后去掉百分號）

來個橙色的例子:
 

CSS 

1. rgba(100%, 64.7%, 0%, 1)  

結(jié)果:

CSS 

1. Red: (100% x 255) / 100% = 255   

2. Green: (64.7% x 255) / 100% = 165 (四舍五入到最接近的整數(shù))   

3. Blue: (0% x 255) / 100% = 0   

4. Alpha: 1  

轉(zhuǎn)化成整數(shù)后的值為:
 

CSS

1. rgba(255, 165, 0, 1)  

瀏覽器支持
RGBa顏色現(xiàn)在在Webkit 和Gecko 核心的瀏覽器被支持，IE各個版本的瀏覽器和Opera還都不支持。就像Chris在他關(guān)于RGBa的精彩的文章里 提到的，你可以使用一個標準的RGB顏色為那些不支持的瀏覽器指定一個向下兼容的屬性。

CSS 

1. div {     

2.    background: rgb(200, 54, 54); /* The Fallback */  

3.    background: rgba(200, 54, 54, 0.5);   

4. }  

另一個漸進增強或適度降級的例子。

看完上述內(nèi)容，你們對CSS3的RGBA中關(guān)于整數(shù)和百分比值的轉(zhuǎn)換的示例分析有進一步的了解嗎？如果還想了解更多知識或者相關(guān)內(nèi)容，請關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，感謝大家的支持。

網(wǎng)頁題目：CSS3的RGBA中關(guān)于整數(shù)和百分比值的轉(zhuǎn)換的示例分析
網(wǎng)頁地址：http://www.rwnh.cn/article26/pgsdcg.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供外貿(mào)建站、服務(wù)器托管、商城網(wǎng)站、網(wǎng)站改版、域名注冊、網(wǎng)站設(shè)計

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)