الفرق بين المراجعتين لصفحة: «Sass/lighten»

مراجعة 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()‎:تُعيدُ الدالة مُكوّن التشبع الخاص باللون.

مصادر

قسم الدالة في صفحة الدوال في توثيق Sass الرسمي.

@@ سطر 1: / سطر 1: @@
 <noinclude>{{DISPLAYTITLE: الدالة <code>()lighten</code> في Sass}}</noinclude>
-تُعيدُ الدالة <code>()lighten</code> مُكوّن الإضاءة (lightness) الخاص باللون. انظر [[https://sass-lang.com/documentation/Sass/Script/hsl مواصفات] [[CSS|CSS3]] HSL]. يُحتسب من مكونات RGB عند الضرورة عبر [هذه [https://sass-lang.com/documentation/Sass/Script/rgb-to-hsl الخوارزمية]].
+تجعل الدالة <code>()lighten</code> اللون أكثر إضاءةً (lightness). وتأخذ لونا وعددا بين <code>‎0%</code> و <code>‎100%.</code>وتعيد لونًا بعد تعديل الإضاءة.
 == البنية العامة ==
 <syntaxhighlight lang="sass">
-#lightness ($color)
+#lighten ($color, $amount)
 </syntaxhighlight>
@@ سطر 10: / سطر 10: @@
 === <code>‎$color</code> ===
 قيمة لونية.
+<code>‎$amount </code>
+مقدار رفع الإضاءة، قيمته تكون بين  <code>‎0%</code> و <code>‎100%.</code>
 == القيم المعادة ==
-قيمة الإضاءة، وتكون بين ‎<code>100%</code> و ‎<code>0%</code>.
+اللون المُعدّل.
 == الأخطاء والاستثناءات ==
-سيُرمى الخطأ <code>ArgumentError</code> إن لم يكن <code>‎$color</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#saturation-instance_method قسم الدالة  في صفحة الدوال في توثيق Sass الرسمي.]
+* [https://sass-lang.com/documentation/Sass/Script/Functions.html#lighten-instance_method قسم الدالة  في صفحة الدوال في توثيق Sass الرسمي.]
 [[تصنيف:Sass]]
 [[تصنيف: Sass Function]]