الدالة ()rgba في Sass

من موسوعة حسوب
مراجعة 18:03، 3 مايو 2018 بواسطة جميل-بيلوني (نقاش | مساهمات) (مراجعة الصفحة وتدقيقها.)

تغيّر الدالة ()rgba قيمة شفافيَّة لون معيّن أو تُنشئ لونًا انطلاقا من تمرير قيمة المكوِّنات: الأحمر والأخضر والأزرق والشفافيَّة.

البنية العامة

rgba($red, $green, $blue,$alpha)
rgba($color,$alpha)

المعاملات

‎$red

قيمة المكوِّن الأحمر في اللون، ويجب أن تتراوح بين 0 و 255 أو بين ‎ 0%‎و ‎100%.

‎$green

قيمة المكوِّن الأخضر في اللون، ويجب أن تتراوح بين 0 و 255 أو بين ‎ 0%‎و ‎100%.

‎$blue

قيمة المكوِّن الأزرق في اللون، ويجب أن تتراوح بين 0 و 255 أو بين ‎ 0%‎و ‎100%.

‎$alpha

قيمة شفافيِّة اللون، ويجب أن تتراوح بين 0 و1.

‎$color

اللون المراد تغيير قيمة شفافيَّته.

‎$alpha

شفافية اللون، ويجب أن تتراوح بين 0 و1.

القيم المعادة

يُعاد لون جديد إن مرِّر إلى الدالة قيمة العوامل ‎$red و ‎$green و ‎$blue، أو يُعاد اللون ‎$color بعد تغيير قيمة شفافيَّته إلى القيمة ‎$alpha.

الأخطاء والاستثناءات

سيُرمى الخطأ ArgumentError إن كان نوع أحد المعاملات الممرَّرة خطأ، أو كانت قيمته خارج المجال المسموح.

أمثلة

المثال 1: استخدام الدالة rgba()‎ لضبط قيمة اللون (color) ولون الخلفية (background-color).

.selector {
  color: rgba(#102030, 0.5);// rgba(16, 32, 48, 0.5)
  background-color: rgba(blue, 0.2); // rgba(0, 0, 255, 0.2)
}

سيُصرّف المثال السابق إلى شيفرة CSS الآتية:

.selector {
  color: rgba(16, 32, 48, 0.5);
  background-color: rgba(0, 0, 255, 0.2);
}

انظر أيضًا

  • الدالة rgb()‎: تُنشئ لونًا انطلاقًا من المكوِّنات الثلاث: الأحمر والأخضر والأزرق.
  • الدالة alpha()‎: تُعيد قيمة مكون الشفافيَّة (alpha).
  • الدالة adjust_color()‎: تغيِّر قيمة مكوِّنات اللون الممرَّر إليها.
  • الدالة hsl()‎‎: تُنشئ لونًا انطلاقا من قيم الصبغة والتشبُّع والإضاءة.

مصادر