CSS内のカラーコード8桁をRGBAに一括変換
IEはさておき、Edgeまで透明度ありのHEX8桁使えないの!?
ChromeでWebアプリをゴリゴリ作り込んでいたら、IE、Edgeで透明色が表示されないことが判明。
HEX8桁のカラーコード(例 #3498dbdd)に対応していないらしいのですが、
今更、全てのCSS中を探して、逐一変換していくのはちょっと、、
こんなお間抜けは筆者だけなのかもしれませんが、
Webサービス等でも一括変換はしてくれなかったので、Pythonでサクッと一括変換コードを書きました。
なんてことはない正規表現です。
ファイル内の全てのHEX8桁 → rgba()
int(文字列, 基数)
で、○進数表記の文字列`を10進数の数値に変換できます。
import re
def hex2rgba(css):
# 正規表現で8桁HEX部分を探索
pattern = r'#[a-fA-F0-9]{8}'
m = re.findall(pattern, css)
for ccode in m:
r = int(ccode[1:3], 16)
g = int(ccode[3:5], 16)
b = int(ccode[5:7], 16)
a = int(ccode[7:9], 16)/255
rgba = "rgba({}, {}, {}, {})".format(r, g, b, a)
css = css.replace(ccode, rgba)
return(css)
お試し
hex2rgba("#3498dbdd")
# 'rgba(52, 152, 219, 0.8666666666666667)'
ついでにCSSファイル全部変換
あとはJupyterでも開いて、glob使ってサクッと全CSSファイルを一括変換
import codecs
import glob
from tqdm import tqdm
fn_list = glob.glob('hogehoge/static/app/css/*.css')
for fn in tqdm(fn_list):
with codecs.open(fn, encoding='utf-8') as f:
css = f.read()
css_mod = hex2rgba(css)
with codecs.open(fn, encoding='utf-8', mode='w') as f:
f.write(css_mod)
終盤で急にIE対応が必要になった際は、是非。
(そんな要件定義はイヤだ)
環境
- Python 3.6.5
- Windows10
- Jupyter notebook
Ref.
Author And Source
この問題について(CSS内のカラーコード8桁をRGBAに一括変換), 我々は、より多くの情報をここで見つけました https://qiita.com/mash8708/items/df25076d231b3f49bbf6著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .