لغو متغیرهای سراسری با متغیرهای محلی
همان‌طور که در صفحه قبلی یاد گرفتیم، متغیرهای سراسری را می‌توان در سراسر سند استفاده کرد، در حالی که متغیرهای محلی فقط در سلکتوری که در آن تعریف شده‌اند، استفاده می‌شوند.
در مثال زیر، متغیرهای سراسری برای رنگ‌های آبی و سفید تعریف شده‌اند و از آن‌ها در جاهای مختلف استفاده شده است:
:root {
--blue: #1e90ff;
--white: #ffffff;
}
body {
background-color: var(--blue);
}
h2 {
border-bottom: 2px solid var(--blue);
}
.container {
color: var(--blue);
background-color: var(--white);
padding: 15px;
}
button {
background-color: var(--white);
color: var(--blue);
border: 1px solid var(--blue);
padding: 5px;
}لغو متغیر سراسری با متغیر محلی
تعریف متغیر محلی جدید
button {
--button-blue: #0000ff; /* متغیر محلی جدید */
background-color: var(--white);
color: var(--button-blue);
border: 1px solid var(--button-blue);
padding: 5px;
}مزیت استفاده از متغیرهای محلی
با استفاده از متغیرهای محلی، می‌توانیم بدون تغییر در کل سند، به راحتی استایل خاصی را برای یک بخش مشخص تغییر دهیم.
برای ارسال نظر لطفا ابتدا وارد حساب کاربری خود شوید. صفحه ورود و ثبت نام