تمثيل سداسي للون مع قناة ألفا؟
سؤال
هل هناك معيار W3 أو أي معيار آخر جدير بالملاحظة حول كيفية تمثيل اللون (بما في ذلك قناة ألفا) بتنسيق سداسي عشري؟
هل هو #RGBA أم #ARGB ؟
المحلول
في CSS 3، للاقتباس من المواصفات، "لا يوجد تدوين سداسي عشري لقيمة RGBA" (انظر مواصفات CSS المستوى 3).بدلاً من ذلك، يمكنك استخدام الترميز الوظيفي rgba() مع الكسور العشرية أو النسب المئوية، على سبيل المثال.rgba(255, 0, 0, 0.5) سيكون باللون الأحمر الشفاف بنسبة 50%.قنوات RGB هي 0-255 أو 0%-100%، ألفا هي 0-1.
في CSS 4*، يمكنك تحديد قناة ألفا باستخدام الحرفين السابع والثامن من لون سداسي عشري مكون من 8 أرقام، أو الحرف الرابع من لون سداسي عشري مكون من 4 أرقام (انظر مواصفات CSS المستوى 4*)
اعتبارًا من مايو 2019، من المتوقع أن يفهم أكثر من 80% من المستخدمين تنسيق #RGBA
- لقد دعم Firefox بناء الجملة هذا منذ الإصدار Firefox 49 (علة موزيلا 567283).
- يدعم Safari بناء الجملة هذا منذ Safari 10.
- لقد دعم Chrome بناء الجملة هذا منذ الإصدار 62 من Chrome.بالنسبة للإصدارات السابقة، يمكنك تمكين ميزات الويب التجريبية لاستخدام بناء الجملة هذا.يرى إصدار الكروم رقم 618472 و خطأ ويبكيت 150853.
- يمكن لتطبيقات Android التي تستهدف Android P أو الأحدث استخدام بناء الجملة هذا
- يدعم Opera بناء الجملة هذا في Opera 52 (أو Opera 39 عند تمكين ميزات الويب التجريبية).
- IE 11 وEdgeHTML 18 (Edge 44) لا يدعمان بناء الجملة هذا.ستدعم إصدارات Edge المستندة إلى Chromium بناء الجملة هذا.
معلومات دعم المتصفح المحدثة هي متاح على CanIUse.com
*لا يزال من الناحية الفنية في المسودة، ولكن نظرًا لدعم المتصفح، فمن غير المرجح أن يتم تغيير هذا.
نصائح أخرى
ويبدو أن هناك أي شكل ألفا عرافة: http://www.w3.org/TR/css3- اللون /
وعلى أي حال، إذا كنت تستخدم المعالج CSS مثل ساس ثم يمكنك تمرير عرافة إلى <لأ href = "http://sass-lang.com/docs/yardoc/Sass/Script/Functions.html#rgba-instance_method "> rgba
:
خلفية:
rgba(#000, 0.5);
وعلى المعالج فقط تحويل رمز عرافة إلى RGB تلقائيا.
لست متأكدًا مما إذا كان هناك معيار رسمي-
RGBA هو التمثيل الذي رأيته في الويب Macromedia والبعض الآخر يستخدم ArgB
أعتقد أن RGBA هو التمثيل الأكثر شيوعًا.
إذا كان ذلك مفيدًا فهو من W3 لـ CSS3
http://www.w3.org/TR/css3-color/#rgba-color
يحرر (باتريك):اقتباس من الرابط W3 أعلاه
على عكس قيم RGB، لا يوجد تدوين سداسي عشري لقيمة RGBA
يدعم عرافة ألفا:
background: #56ff0077;
لالمتصفحات القديمة، سيكون لديك لاستخدام:
background-color: rgba(255, 220, 0, 0.3);
هل يمكن أن محاولة وضع لون عرافة في منتقي الألوان من GIMP أو متجر الصورة للحصول على قيمة RGB ثم استخدام القيمة ألفا. على سبيل المثال. الأحمر هو #FF0000
أو rgb(255,0,0
) إذا كنت تريد أحمر مع قيمة ألفا من 0.5 ثم rgba(255,0,0,.5)
.
وربما ليس بالضبط ما تريد ولكن يساعد نأمل.