یک صفحهٔ HTML ساده بسازید و با استفاده از متغیرهای CSS (custom properties) در :root رنگهای اصلی و ثانویه را تعریف کرده و این متغیرها را با تابع var() در استایل عناصر مختلف (مثل body، header و دکمهها) اعمال کنید و برای یکی از متغیرها مقدار جایگزین (fallback) تعیین کنید.
3.0 بازدید آخرین ویرایش در 221 روز قبل ساعت 01:34 0.0
برای حل این سوال از CSS و متغیرهای سفارشی استفاده کنید: در بخش :root متغیرها را با نامهایی مثل --primary-color و --secondary-color تعریف کنید، سپس در قوانین CSS از var(--primary-color) برای قرار دادن مقدار در color یا background استفاده کنید. برای مقدار جایگزین از ساختار var(--unknown, #ff0000) استفاده کنید تا اگر متغیر تعریف نشده بود مقدار پیشفرض اعمال شود. نکتهها: متغیرها به صورت ارثی و با دامنهٔ بلوکی عمل میکنند، میتوانید با افزودن کلاس (مثلاً .dark) مقادیر متغیر را برای تم تاریک بازنویسی کنید و با ابزار توسعهدهنده مرورگر مقدار محاسبهشده را بررسی کنید.
1 پاسخ
جدید ترین قدیمی ترین بالاترین امتیاز پاسخ های من
در حال بارگیری...
برای ارسال پاسخ باید با حساب کاربری وارد شوید.
ورود به حساب کاربری
برای استفاده از رنگها، متغیرهای CSS را در :root تعریف کرده و با var(--primary-color) و var(--secondary-color) به عناصر مانند body و header اعمال کنید. از ساختار var(--نام, مقدار-پیشفرض) برای مقدار جایگزین بهره ببرید تا در صورت نامرعی بودن یا نامعتبر بودن متغیر، مقدار فشردهشده استفاده شود. با افزودن کلاس .dark میتوانید مقادیر متغیرها را برای تم تاریک بازنویسی کنید و به راحتی بین تمها سوئیچ کنید. در عمل، با ابزارهای توسعهدهنده مقدار محاسبهشده را بررسی کنید تا از صحت ارثبری و دامنهٔ بلوکی مطمئن شوید.
گزارش