前端實(shí)現(xiàn)rgb悟衩、rgba剧罩、argb、hex顏色互相轉(zhuǎn)換的原理

前言

以前開發(fā)頁面的時(shí)候用到的顏色一般直接寫hex或者rgb\rgba座泳。如白色的表示可以是:
#fff或者#ffffff惠昔, rgb(255,255挑势,255)镇防, rgba(255, 255, 255, 1)

我一般常用都是這么寫,也沒有研究過他們是啥關(guān)系潮饱,直到現(xiàn)在有個(gè)需求是導(dǎo)出excel的時(shí)候需要設(shè)置單元格的背景色来氧、字體色的時(shí)候,而且規(guī)定只能是argb格式的香拉,我一下子懵了啦扬,我前端只用過hex\rgba,argb又是啥凫碌?或者h(yuǎn)ex\rgba怎么轉(zhuǎn)argb呢扑毡?

轉(zhuǎn)換原理

拿白色來舉例

  • hex: #fff 或者#ffffff
  • rgba: rgba(255, 255, 255, 1)
  • argb: argb(1, 255, 255, 255)

不過我們前端是不用argb的,只用rgba在這種盛险。

一圖勝千言


顏色轉(zhuǎn)換.png

回到我的需求需要argb格式的時(shí)候瞄摊,那么是否可以直接拿argb(1, 255, 255, 255)呢,并不是苦掘,它要的是hex形式表示的argb,所以如果輸入的是rgba(255,255,255,1)的話還是要先轉(zhuǎn)換成hex #ffffffff,再把a那部分挪到前面,在這里8個(gè)字母都是ff所以看不出來换帜。最終輸出 {argb:ffffffff}給到excel。

問題:假如hex是3位表示怎么轉(zhuǎn)換成rgba?很簡單鹤啡,先分成3份惯驼,每份兩個(gè)字母,如#ff0 -> #ffff00揉忘。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末跳座,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子泣矛,更是在濱河造成了極大的恐慌疲眷,老刑警劉巖,帶你破解...
    沈念sama閱讀 217,185評(píng)論 6 503
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件您朽,死亡現(xiàn)場離奇詭異狂丝,居然都是意外死亡换淆,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,652評(píng)論 3 393
  • 文/潘曉璐 我一進(jìn)店門几颜,熙熙樓的掌柜王于貴愁眉苦臉地迎上來倍试,“玉大人,你說我怎么就攤上這事蛋哭∠叵埃” “怎么了?”我有些...
    開封第一講書人閱讀 163,524評(píng)論 0 353
  • 文/不壞的土叔 我叫張陵谆趾,是天一觀的道長躁愿。 經(jīng)常有香客問我,道長沪蓬,這世上最難降的妖魔是什么彤钟? 我笑而不...
    開封第一講書人閱讀 58,339評(píng)論 1 293
  • 正文 為了忘掉前任,我火速辦了婚禮跷叉,結(jié)果婚禮上逸雹,老公的妹妹穿的比我還像新娘。我一直安慰自己云挟,他們只是感情好梆砸,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,387評(píng)論 6 391
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著植锉,像睡著了一般辫樱。 火紅的嫁衣襯著肌膚如雪峭拘。 梳的紋絲不亂的頭發(fā)上俊庇,一...
    開封第一講書人閱讀 51,287評(píng)論 1 301
  • 那天,我揣著相機(jī)與錄音鸡挠,去河邊找鬼辉饱。 笑死,一個(gè)胖子當(dāng)著我的面吹牛拣展,可吹牛的內(nèi)容都是我干的彭沼。 我是一名探鬼主播,決...
    沈念sama閱讀 40,130評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼备埃,長吁一口氣:“原來是場噩夢啊……” “哼姓惑!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起按脚,我...
    開封第一講書人閱讀 38,985評(píng)論 0 275
  • 序言:老撾萬榮一對(duì)情侶失蹤于毙,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后辅搬,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體唯沮,經(jīng)...
    沈念sama閱讀 45,420評(píng)論 1 313
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,617評(píng)論 3 334
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了介蛉。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片萌庆。...
    茶點(diǎn)故事閱讀 39,779評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖币旧,靈堂內(nèi)的尸體忽然破棺而出践险,到底是詐尸還是另有隱情,我是刑警寧澤吹菱,帶...
    沈念sama閱讀 35,477評(píng)論 5 345
  • 正文 年R本政府宣布捏境,位于F島的核電站,受9級(jí)特大地震影響毁葱,放射性物質(zhì)發(fā)生泄漏垫言。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,088評(píng)論 3 328
  • 文/蒙蒙 一倾剿、第九天 我趴在偏房一處隱蔽的房頂上張望筷频。 院中可真熱鬧,春花似錦前痘、人聲如沸凛捏。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,716評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽坯癣。三九已至,卻和暖如春最欠,著一層夾襖步出監(jiān)牢的瞬間示罗,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,857評(píng)論 1 269
  • 我被黑心中介騙來泰國打工芝硬, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留蚜点,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 47,876評(píng)論 2 370
  • 正文 我出身青樓拌阴,卻偏偏與公主長得像绍绘,于是被迫代替她去往敵國和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子迟赃,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,700評(píng)論 2 354

推薦閱讀更多精彩內(nèi)容