الفرق بين المراجعتين ل"Sass/lighten"
< Sass
اذهب إلى التنقل
اذهب إلى البحث
(أنشأ الصفحة ب'<noinclude>{{DISPLAYTITLE: الدالة <code>()lighten</code> في Sass}}</noinclude> تُعيدُ الدالة <code>()lighten</code> مُكوّن الإضاءة (lig...') |
|||
| سطر 1: | سطر 1: | ||
<noinclude>{{DISPLAYTITLE: الدالة <code>()lighten</code> في Sass}}</noinclude> | <noinclude>{{DISPLAYTITLE: الدالة <code>()lighten</code> في Sass}}</noinclude> | ||
| − | + | تجعل الدالة <code>()lighten</code> اللون أكثر إضاءةً (lightness). وتأخذ لونا وعددا بين <code>0%</code> و <code>100%.</code>وتعيد لونًا بعد تعديل الإضاءة. | |
== البنية العامة == | == البنية العامة == | ||
<syntaxhighlight lang="sass"> | <syntaxhighlight lang="sass"> | ||
| − | # | + | #lighten ($color, $amount) |
</syntaxhighlight> | </syntaxhighlight> | ||
| سطر 10: | سطر 10: | ||
=== <code>$color</code> === | === <code>$color</code> === | ||
قيمة لونية. | قيمة لونية. | ||
| + | |||
| + | <code>$amount </code> | ||
| + | |||
| + | مقدار رفع الإضاءة، قيمته تكون بين <code>0%</code> و <code>100%.</code> | ||
== القيم المعادة == | == القيم المعادة == | ||
| − | + | اللون المُعدّل. | |
== الأخطاء والاستثناءات == | == الأخطاء والاستثناءات == | ||
| − | سيُرمى الخطأ <code>ArgumentError</code> إن | + | سيُرمى الخطأ <code>ArgumentError</code> إن كان أحد المعاملات من النوع الخطأ، أو إن كان <code>$amount</code> خارج الحدود. |
| + | |||
| + | == أمثلة == | ||
| + | مثال عن استخدام الدالة abs() لضبط قيمة الحواشي ([[CSS/padding|padding]]) والهوامش ([[CSS/margin|margin]]) إلى 20px:<syntaxhighlight lang="sass"> | ||
| + | .selector { | ||
| + | color: lighten(hsl(0, 0%, 0%), 30%) // hsl(0, 0, 30) | ||
| + | background-color: lighten(#800, 20%) // #e00 | ||
| + | } | ||
| + | </syntaxhighlight>سيُصرّف المثال السابق إلى شيفرة CSS الآتية:<syntaxhighlight lang="css"> | ||
| + | .selector { | ||
| + | color: hsl(0, 0, 30); | ||
| + | background-color: #e00; | ||
| + | } | ||
| + | </syntaxhighlight> | ||
== انظر أيضًا == | == انظر أيضًا == | ||
| سطر 24: | سطر 41: | ||
== مصادر == | == مصادر == | ||
| − | * [https://sass-lang.com/documentation/Sass/Script/Functions.html# | + | * [https://sass-lang.com/documentation/Sass/Script/Functions.html#lighten-instance_method قسم الدالة في صفحة الدوال في توثيق Sass الرسمي.] |
[[تصنيف:Sass]] | [[تصنيف:Sass]] | ||
[[تصنيف: Sass Function]] | [[تصنيف: Sass Function]] | ||
مراجعة 15:38، 19 أبريل 2018
تجعل الدالة ()lighten اللون أكثر إضاءةً (lightness). وتأخذ لونا وعددا بين 0% و 100%.وتعيد لونًا بعد تعديل الإضاءة.
البنية العامة
#lighten ($color, $amount)
المعاملات
$color
قيمة لونية.
$amount
مقدار رفع الإضاءة، قيمته تكون بين 0% و 100%.
القيم المعادة
اللون المُعدّل.
الأخطاء والاستثناءات
سيُرمى الخطأ ArgumentError إن كان أحد المعاملات من النوع الخطأ، أو إن كان $amount خارج الحدود.
أمثلة
مثال عن استخدام الدالة abs() لضبط قيمة الحواشي (padding) والهوامش (margin) إلى 20px:
.selector {
color: lighten(hsl(0, 0%, 0%), 30%) // hsl(0, 0, 30)
background-color: lighten(#800, 20%) // #e00
}
سيُصرّف المثال السابق إلى شيفرة CSS الآتية:
.selector {
color: hsl(0, 0, 30);
background-color: #e00;
}
انظر أيضًا
- الدالة
hsla():تُنشئ لونًا انطلاقا من قيم الصبغة والتشبع والإضاءة والشفافية. - الدالة
hsl():تُنشئ لونًا انطلاقا من قيم الصبغة والتشبع والإضاءة والشفافية. - الدالة
hue():تُعيدُ الدالة مُكوّن الصبغة الخاص باللون. - الدالة
saturation():تُعيدُ الدالة مُكوّن التشبع الخاص باللون.