freeCodeCamp/guide/arabic/certifications/responsive-web-design/basic-css/cascading-css-variables/index.md

2.1 KiB

title localeTitle
Cascading CSS Variables المتتالية CSS المتغيرات

المتتالية CSS المتغيرات

متغيرات CSS المتتالية تسمى رسميًا الخصائص المخصصة هي كيانات تتصرف بالمثل مع المتغيرات التقليدية. في هذه المتغيرات تسمح لتخزين البيانات وتحديثها لتعكس القيم الجديدة في وقت لاحق 2 .

يتم تعريف متغيرات CSS لاحتواء قيم محددة وإعادة استخدامها في جميع أنحاء المستند. يتم تعيينها باستخدام تدوين الخاصية المخصصة (على سبيل المثال ، --main-color: black ) ويتم الوصول إليها باستخدام الدالة var() (على سبيل المثال ، color: var(--main-color) ) 1 . قم بتعريف متغير CSS في :root محددات :root أو body للوصول العام.

عند الحفاظ على مستندات CSS معقدة ، ليس من المفيد فقط استخدام متغيرات CSS ولكن أيضًا ذكية. عند إجراء تحديثات مستقبلية بدلاً من البحث عن مئات الأسطر البرمجية المحتملة ، يحتاج المرء فقط إلى تحديث متغير CSS اللازم 1 .

بناء الجملة

`:root { --main-bkgnd-color: #00B8CB; }

body { background-color: var(--main-bkgnd-color); font-family: 'Raleway', Helvetica, sans-serif; } `

التصريح عن المتغير:

--custom-name: value

باستخدام المتغير: css var(--custom-name)

مصادر

  1. قم بزيارة صفحة متتالية CSS CSS الخاصة بـ MDN للحصول على مزيد من المعلومات.
  2. بيرنا ، ماريا أنطونييتا. "دليل عملي إلى متغيرات CSS (خصائص مخصصة)" sitepoint . 1 أغسطس 2018. تم الوصول إليها: 5 أكتوبر 2018