یک صفحه ساده بسازید که در آن متغیرهای CSS (مثل --primary-color، --text-color و --spacing) در :root تعریف شوند و سپس در استایل عناصر مختلف با تابع var() استفاده و در یک بخش محلی مقدار یکی از متغیرها بازنویسی شود.
3.0 بازدید آخرین ویرایش در 221 روز قبل ساعت 01:34 0.0
در فایل CSS متغیرها را در سلکتور :root تعریف کنید (مثلاً --primary-color: #3498db; --text-color: #fff; --spacing: 16px) و سپس با var(--primary-color) و var(--spacing) آنها را به properties مانند background-color، color و padding اختصاص دهید. از مقدار پشتیبان در var() استفاده کنید (مثلاً var(--unknown, #000)) و برای نشان دادن اسکُپ محلی، در یک کانتینر مقدار یکی از متغیرها را بازنویسی کنید تا مطالباتی مانند تغییر رنگ درون آن بخش را ببینید؛ میتوانید var() را همراه calc() برای محاسبه فاصلهها نیز به کار ببرید.
توسط پژوهشگر در 221 روز قبل ساعت 01:34 1 پاسخ
جدید ترین قدیمی ترین بالاترین امتیاز پاسخ های من
در حال بارگیری...
برای ارسال پاسخ باید با حساب کاربری وارد شوید.
ورود به حساب کاربری
این رویکرد با تعریف متغیرها در :root و ارجاع با var() به راحتی سبکپذیری و پویایی را به CSS اضافه میکند. اگر نام یک متغیر ناوجود باشد، مقدار fallback ارائهشده در var(...) استفاده میشود؛ بدون fallback ممکن است سبک نامعتبر یا خام اعمال شود. برای نمایش اسکُپ محلی، میتوانید با بازنویسی مقدار یکی از متغیرها در یک کانتینر خاص رنگ یا فاصله را در همان بخش تغییر دهید. همچنین میتوانید از calc() همراه var() برای محاسبه فواصل یا اندازهها استفاده کنید و مطمئن شوید مرورگرهای مدرن از آن پشتیبانی میکنند. برای دسترسیپذیری، هنگام تغییر رنگ با مقدار زمینه یا متن، نسبت کنتراست را بررسی کنید.
گزارش