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

من موسوعة حسوب
لا ملخص تعديل
لا ملخص تعديل
سطر 1: سطر 1:
تُنشئ لونًا انطلاقا من قيم الصبغة (hue) والتشبع (saturation) والإضاءة (lightness) والشفافية (alpha). تستخدم الدالة [http://www.w3.org/TR/css3-color/#hsl-color خوارزمية] من مواصفات [[CSS|CSS3]].<noinclude>{{DISPLAYTITLE: الدالة <code>()hsla</code> في Sass
تُنشئ لونًا انطلاقا من قيم الصبغة (hue) والتشبع (saturation) والإضاءة (lightness) والشفافية (alpha). تستخدم الدالة [http://www.w3.org/TR/css3-color/#hsl-color خوارزمية] من مواصفات [[CSS|CSS]].<noinclude>{{DISPLAYTITLE: الدالة <code>()hsla</code> في Sass
}}</noinclude>
}}</noinclude>


== البنية العامة ==
== البنية العامة ==
<syntaxhighlight lang="sass">
<syntaxhighlight lang="sass">
hsl($hue, $saturation, $lightness, $alpha)
hsla($hue, $saturation, $lightness, $alpha)
</syntaxhighlight>
</syntaxhighlight>


سطر 25: سطر 25:


== الأخطاء والاستثناءات ==
== الأخطاء والاستثناءات ==
سيُرمى الخطأ <code>ArgumentError</code> إن كانت المعاملات من النوع الخاطئ أو كان <code>‎$lightness أو ‎$saturation</code> أو <code>‎$alpha</code> خارج الحدود.
سيُرمى الخطأ <code>ArgumentError</code> إن كانت المعاملات من النوع الخاطئ أو كان <code>‎$lightness</code> أو <code>‎$saturation</code> أو <code>‎$alpha</code> خارج الحدود.
 
== أمثلة ==
مثال على ضبط قيمة الخاصية <code>[[CSS/color|color]]</code> باستخدام الدالة <code>hsla()‎</code>:<syntaxhighlight lang="sass">
.selector {
  color: hsl(50, 50, 50); // #bfaa40
}
 
</syntaxhighlight>ستُصرّف الشيفرة السابقة إلى شيفرة CSS الآتية:<syntaxhighlight lang="css">
.selector {
  color: #bfaa40;
}
 
</syntaxhighlight>


== انظر أيضًا ==
== انظر أيضًا ==
* الدالة <code>[[Sass/hsl|'''hsl'''()]]</code>‎:تُنشئ لونًا انطلاقا من قيم الصبغة والتشبع والإضاءة والشفافية.
* الدالة <code>[[Sass/hsl|hsl()]]</code>‎: تُنشئ لونًا انطلاقًا من قيم الصبغة والتشبع والإضاءة.


== مصادر ==
== مصادر ==
* [https://sass-lang.com/documentation/Sass/Script/Functions.html#hsla-instance_method قسم الدالة  في صفحة الدوال في توثيق Sass الرسمي.]
* [https://sass-lang.com/documentation/Sass/Script/Functions.html#hsla-instance_method قسم الدالة hsla في صفحة الدوال في توثيق Sass الرسمي.]
[[تصنيف:Sass]]
[[تصنيف:Sass]]
[[تصنيف: Sass Function]]
[[تصنيف: Sass Function]]

مراجعة 04:46، 21 أبريل 2018

تُنشئ لونًا انطلاقا من قيم الصبغة (hue) والتشبع (saturation) والإضاءة (lightness) والشفافية (alpha). تستخدم الدالة خوارزمية من مواصفات CSS.

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

hsla($hue, $saturation, $lightness, $alpha)

المعاملات

‎$hue

صبغة اللون. يجب أن تكون بين 0 و 360 درجة.

‎$saturation

تشبُّع اللون. يجب أن يكون محصورًا بين ‎0%‎ و ‎100%.

‎$lightness 

إضاءة اللون. يجب أن تكون بين ‎0%‎ و ‎100%.

‎$alpha

شفافية اللون. يجب أن تكون بين 0 و 1.

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

اللون الناتج.

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

سيُرمى الخطأ ArgumentError إن كانت المعاملات من النوع الخاطئ أو كان ‎$lightness أو ‎$saturation أو ‎$alpha خارج الحدود.

أمثلة

مثال على ضبط قيمة الخاصية color باستخدام الدالة hsla()‎:

.selector {
  color: hsl(50, 50, 50); // #bfaa40
}

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

.selector {
  color: #bfaa40;
}

انظر أيضًا

  • الدالة hsl()‎: تُنشئ لونًا انطلاقًا من قيم الصبغة والتشبع والإضاءة.

مصادر