CSSدوال الحسابات
- ما هي دوال الحسابات
- الدالة calc()
- الدالة max()
- الدالة min()
ما هي دوال الحسابات
توفر CSS دوال برمجية ( Functions ) يمكن استخدامها لإجراء عمليات حسابية و ذلك لتعيين أحجام العناصر بشكل مرن و بسيط جداً.
في هذا الدرس ستتعلم كيفية عمل و استخدام الدوال calc() و min() و max() بشكل مفصّل.
يمكنك الإستفادة كثيراً من هذه الدوال عند تصميم صفحات متجاوبة ( Responsive ).
هذا الأمر ستدركه مستقبلاً حين تقوم ببناء تصاميمك الخاصة.
الدالة calc()
يمكنك استخدام هذه الدالة لإجراء عمليات حسابية كالإضافة، الطرح، الضرب و القسمة عند حساب القياسات.
الرموز التي يمسح لك باستخدامها فيها هي + - * /.
في المثال التالي قمنا بجعل عرض العنصر يساوي كامل المساحة المتوفرة ناقص 80 بكسل. ثم قمنا بإعاده من جهة اليسار بمقدار 40 بكسل. بهذا الطريقة سيبدو العنصر ظاهراً على كامل عرض الصفحة و بعيداً بمقدار 40 بكسل من اليسار و 40 بكسل من اليمين.
مثال
الدالة max()
يمكنك استخدام هذه الدالة لوضع عدة قيم و جعل المتصفح يختار القيمة الأكبر منها طالما أنها متاحة.
هذه الدالة تتوقع منك قيمة واحدة على الأقل، و في حال وضع أكثر من قيمة فإنه يجب وضع فاصلة بين كل قيمتين.
في المثال التالي قمنا بوضع قيمتين لتحديد العرض و هما 300 بكسل و 50%. القيمة التي يجد المتصفح أنها أكبر و أنه بالإمكان استخدامها هي التي سيتم اعتمادها.
الدالة min()
يمكنك استخدام هذه الدالة لوضع عدة قيم و جعل المتصفح يختار القيمة الأصغر منها طالما أنها متاحة.
هذه الدالة تتوقع منك قيمة واحدة على الأقل، و في حال وضع أكثر من قيمة فإنه يجب وضع فاصلة بين كل قيمتين.
في المثال التالي قمنا بوضع قيمتين لتحديد العرض و هما 300 بكسل و 50%. القيمة التي يجد المتصفح أنها أصغر و أنه بالإمكان استخدامها هي التي سيتم اعتمادها.
