الفرق بين المراجعتين ل"Sass/rgba"
< Sass
اذهب إلى التنقل
اذهب إلى البحث
جميل-بيلوني (نقاش | مساهمات) ط (مراجعة الصفحة وتدقيقها.) |
|||
| سطر 1: | سطر 1: | ||
<noinclude>{{DISPLAYTITLE: الدالة <code>()rgba</code> في Sass}}</noinclude> | <noinclude>{{DISPLAYTITLE: الدالة <code>()rgba</code> في Sass}}</noinclude> | ||
| − | + | تغيّر الدالة <code>()rgba</code> قيمة شفافيَّة لون معيّن أو تُنشئ لونًا انطلاقا من تمرير قيمة المكوِّنات: الأحمر والأخضر والأزرق والشفافيَّة. | |
| − | == البنية العامة | + | ==البنية العامة== |
| − | |||
<syntaxhighlight lang="sass"> | <syntaxhighlight lang="sass"> | ||
rgba($red, $green, $blue,$alpha) | rgba($red, $green, $blue,$alpha) | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
rgba($color,$alpha) | rgba($color,$alpha) | ||
</syntaxhighlight> | </syntaxhighlight> | ||
| − | + | ==المعاملات== | |
| − | ==== | + | ===<code>$red</code>=== |
| − | + | قيمة المكوِّن الأحمر في اللون، ويجب أن تتراوح بين 0 و 255 أو بين 0%و 100%. | |
| − | ===== <code>$ | + | ===<code>$green</code>=== |
| − | + | قيمة المكوِّن الأخضر في اللون، ويجب أن تتراوح بين 0 و 255 أو بين 0%و 100%. | |
| − | + | ===<code>$blue</code>=== | |
| − | + | قيمة المكوِّن الأزرق في اللون، ويجب أن تتراوح بين 0 و 255 أو بين 0%و 100%. | |
| − | + | ===<code>$alpha</code>=== | |
| − | + | قيمة شفافيِّة اللون، ويجب أن تتراوح بين 0 و1. | |
| − | == القيم المعادة == | + | ===<code>$color</code>=== |
| − | اللون | + | اللون المراد تغيير قيمة شفافيَّته. |
| − | + | ===<code>$alpha</code>=== | |
| − | == الأخطاء والاستثناءات == | + | شفافية اللون، ويجب أن تتراوح بين 0 و1. |
| − | سيُرمى الخطأ <code>ArgumentError</code> إن | + | ==القيم المعادة== |
| − | + | يُعاد لون جديد إن مرِّر إلى الدالة قيمة العوامل <code>$red</code> و <code>$green</code> و <code>$blue</code>، أو يُعاد اللون <code>$color</code> بعد تغيير قيمة شفافيَّته إلى القيمة <code>$alpha</code>. | |
| − | == أمثلة == | + | ==الأخطاء والاستثناءات== |
| − | + | سيُرمى الخطأ <code>ArgumentError</code> إن كان نوع أحد المعاملات الممرَّرة خطأ، أو كانت قيمته خارج المجال المسموح. | |
| + | ==أمثلة== | ||
| + | المثال 1: استخدام الدالة <code>rgba()</code> لضبط قيمة اللون (<code>[[CSS/color|color]]</code>) ولون الخلفية (<code>[[CSS/background-color|background-color]]</code>).<syntaxhighlight lang="sass"> | ||
.selector { | .selector { | ||
color: rgba(#102030, 0.5);// rgba(16, 32, 48, 0.5) | color: rgba(#102030, 0.5);// rgba(16, 32, 48, 0.5) | ||
| سطر 48: | سطر 31: | ||
} | } | ||
| − | </syntaxhighlight> | + | </syntaxhighlight>سيُصرّف المثال السابق إلى شيفرة [[CSS]] الآتية:<syntaxhighlight lang="css"> |
| − | |||
| − | سيُصرّف المثال السابق إلى شيفرة [[CSS]] الآتية:<syntaxhighlight lang="css"> | ||
.selector { | .selector { | ||
color: rgba(16, 32, 48, 0.5); | color: rgba(16, 32, 48, 0.5); | ||
| سطر 57: | سطر 38: | ||
</syntaxhighlight> | </syntaxhighlight> | ||
| − | + | ==انظر أيضًا== | |
| − | == انظر أيضًا == | + | *الدالة <code>[[Sass/rgb|rgb()]]</code>: تُنشئ لونًا انطلاقًا من المكوِّنات الثلاث: الأحمر والأخضر والأزرق. |
| − | * الدالة <code>[[Sass/rgb|rgb()]]</code>: تُنشئ لونًا انطلاقًا من | + | *الدالة <code>[[Sass/alpha|alpha()]]</code>: تُعيد قيمة مكون الشفافيَّة (alpha). |
| − | + | *الدالة <code>[[Sass/adjust color|adjust_color()]]</code>: تغيِّر قيمة مكوِّنات اللون الممرَّر إليها. | |
| − | == مصادر == | + | *الدالة <code>[[Sass/alpha|hsl()]]</code>: تُنشئ لونًا انطلاقا من قيم الصبغة والتشبُّع والإضاءة. |
| − | * [https://sass-lang.com/documentation/Sass/Script/Functions.html#rgba-instance_method قسم الدالة | + | ==مصادر== |
| + | *[https://sass-lang.com/documentation/Sass/Script/Functions.html#rgba-instance_method قسم الدالة rgba في صفحة الدوال في توثيق Sass الرسمي.] | ||
[[تصنيف:Sass]] | [[تصنيف:Sass]] | ||
[[تصنيف: Sass Function]] | [[تصنيف: Sass Function]] | ||
مراجعة 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(): تُنشئ لونًا انطلاقا من قيم الصبغة والتشبُّع والإضاءة.