Bug • باگ
Bug • باگ
خواندن ۲ دقیقه·۵ سال پیش

? جرقه 2 : hex هشتایی

معرفی سری پست های جرقه ?

در این سری ، نکات ریز و جالب و ابزار های کوچیک و کاربردی که ممکنه بدردمون بخوره رو در قالب پست های کوچیک خواهیم داشت. این سری بیشتر در زمینه برنامه نویسی هستند ولی قرار نیست فقط در مورد زبان برنامه نویسی خاصی باشند.



آشنایی با HEX هشتایی

وقتی صحبت رنگ میشه تو css من درک بهتری از کد رنگا به صورت hex دارم و اکثر رنگایی هم که دارم hex هستن و هرجا نیاز به opacity داشتم باید از rgba استفاده میکردم و میرفتم سراغ convertor ـی که برام hex رو بگیره و rgb اش رو بده در نتیجه همیشه این تبدیل برام سخت بود و امیدوارم بود روزی این قابلیت باشه که مثل کد رنگای rgb برای hex هم بتونیم opacity ست کنیم.
چند ماه پیش در موردش کنجکاو شدم که ایا واقعا راه دیگه ای نیست که با hex هشتایی آشنا شدم. hex هشتایی دقیقا مثل هر کد رنگ دیگه مون هست ولی به جای 6 ، 8ـتایی هست و اون 2ـتای جدید نشانگر مقدار opacity به صورت هگزادسیمال هست. این feature پشتیبانی خوبی داره که اینجا میتونین ببینینش.

کد زیر همون آبی با opacity 50%

background: #0000ff80;

نکته : همونطور که متوجه شدین ما گفتیم مقدار opacity 50 ـه ولی به کد رنگ آبی 80 رو اضافه کردیم دلیلش اینه که مقدار opacity ما به درصده ولی ازونجایی که تو hex ما با اعداد هگزادسیمال کار داریم باید درصد رو به مقدار هگزادسیمال تبدیل کنیم . که تبدیل راحتی هست ما 2 رقم تو مبنای 16 داریم بیشترین مقدار مبنا 16 Fـه که نمایانگر عدد 15 ـه وقتی دو رقم داریم میشه FF که برابر با 255ـه در نتیجه 100% میشه FF و به همین ترتیب میتونیم 50% رو محاسبه کنیم که میشه 80. که تیبلشو میتونین تو این لینک ببینین.

https://jsfiddle.net/48robwzL/

می ارزه ازش استفاده کنیم ؟

بستگی داره اگه تبدیل کردن براتون مشکله یا مرورگری که میخواین ساپورت نمیکنه طبیعتا نه ولی برای من که میتونم تو چند ثانیه تبدیلش کنم و ساپورت مرورگرش برای من مشکلی نیست توی پروژه هام ازش استفاده میکنم.




شما چطور ؟ آیا استفاده از این به جای rgba رو مناسب میدونین ؟

ممنون که خوندین شاد و سلامت باشین ✌️

cssطراحی وب
یه توسعه دهنده که عاشق تولید محتوا و آموزشه
شاید از این پست‌ها خوشتان بیاید