توابع CSS var()

تعریف و استفاده

CSS var() تابع برای وارد کردن مقدار متغیر CSS استفاده می‌شود.

مثال

مثال 1

ابتدا یک متغیر جهانی به نام --main-bg-color تعریف کنید، سپس در جدول استایل استفاده کنید var() تابع برای وارد کردن مقدار متغیر:

:root {
  --main-bg-color: coral;
}
#div1 {
  background-color: var(--main-bg-color);
}
#div2 {
  background-color: var(--main-bg-color);
}

آزمایش کنید

مثال 2

مثال دیگری از استفاده: var() مثال‌هایی از استفاده چندین مقدار متغیر CSS در یک تابع:

:root {
  --main-bg-color: coral;
  --main-txt-color: blue;
  --main-padding: 15px;
}
#div1 {
  background-color: var(--main-bg-color);
  color: var(--main-txt-color);
  padding: var(--main-padding);
}
#div2 {
  background-color: var(--main-bg-color);
  color: var(--main-txt-color);
  padding: var(--main-padding);
}

آزمایش کنید

آموزش CSS

var(--name, value)

جزئیات فنی

پشتیبانی مرورگر

تبلویغات میزانی نشانگر نسخه اولیه مرورگرهایی هستند که این عملکرد را کامل پشتیبانی می‌کنند.

مربوط صفحات

تعلیم:CSS متغیر