توابع ریاضی CSS

توابع ریاضی CSS اجازه می‌دهد تا معادلات ریاضی را به عنوان مقادیر ویژگی استفاده کنید. این فصل به توضیح calc()،max() و min() توابع.

توابع calc()

calc() این تابع محاسبه انجام می‌دهد و نتیجه را به عنوان مقدار ویژگی استفاده می‌کند.

قوانین CSS

calc(expression)

اجازه دهید یک مثال ببینیم:

مثال

استفاده از calc() محاسبه عرض عناصر <div>:

#div1 {
  position: absolute;
  left: 50px;
  width: calc(100% - 100px);
  border: 1px solid black;
  background-color: yellow;
  padding: 5px;
}

آزمایش کنید

توابع max()

max() این تابع از بزرگ‌ترین مقدار در لیست مقادیر جدا شده با کاما به عنوان مقدار ویژگی استفاده می‌کند.

قوانین CSS

max(value1, value2, ...)

اجازه دهید یک مثال ببینیم:

مثال

استفاده از max() مقدار #div1 را به بزرگ‌ترین مقدار بین 50% یا 300px تنظیم کنید:

#div1 {
  background-color: yellow;
  height: 100px;
  width: max(50%, 300px);
}

آزمایش کنید

دستورالعمل min()}

min() این کاربردها از لیست مقادیر جدا شده با کاما برای انتخاب کوچکترین مقدار به عنوان مقادیر ویژگی استفاده می‌کنند.

قوانین CSS

min(value1, value2, ...)

اجازه دهید یک مثال ببینیم:

مثال

استفاده از min() بازسازی عرض #div1 به 50% یا کوچکترین مقدار 300px:

#div1 {
  background-color: yellow;
  height: 100px;
  width: min(50%, 300px);
}

آزمایش کنید

دستورالعمل‌های کاربردی CSS

برای دسترسی به لیست کامل دستورالعمل‌های CSS، لطفاً به دستورالعمل‌های کاربردی CSS。