CSS function log

Опис

log() - ця CSS-функція використовується для обчислення натурального логарифму заданого числа. Логарифм - це математична функція, яка визначає показник, до якого потрібно піднести певне число (основу логарифма), щоб отримати дане число. Використання функції log() дозволяє виконувати обчислення логарифмів та використовувати їх результат у стилях CSS.

Функція log() приймає два аргументи - число та його основу. Число вказується як перший аргумент, а основа - як другий. Значення числа повинно бути додатнім, а значення основи має бути більше 0 і не може бути рівним 1. Наприклад, log(8, 2) обчислить натуральний логарифм числа 8 за основою 2.

Функція log() може бути корисною для обчислення складних значень або визначення властивостей на основі математичних розрахунків. Наприклад, ви можете використовувати log() для визначення прозорості або інтенсивності кольору на основі логарифмічної шкали.

Приклад використання функції log():

.element {
  font-size: calc(10px + log(8, 2) * 5px);
}

У цьому прикладі, функція log(8, 2) обчислить натуральний логарифм числа 8 за основою 2, що дорівнює приблизно 3, і використає результат для визначення розміру шрифту .element. Результатом буде розмір шрифту, обчислений згідно логарифмічної формули.

правити

Порада

Переконайтеся, що передаєте числові значення для обчислення логарифма. Наприклад, log(100, 10) або log(256, 2).

автор: Bond правити

Порада

Використовуйте функцію log() для обчислення логарифмів в різних ситуаціях, де вам потрібно здійснити обчислення на основі логарифмів.

автор: Bond правити

+ додати пораду чи нотатку

Синтаксис

log(number, base);

Функція log може отримувати єдине значення:

<number>

Приймає числові значення для обчислення логарифма.

автор: Bond

правити

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
	120	118	15.4	106	120	—

Підтримка: мобільні переглядачі

Переглядач
	120	120	118	15.4

Приклади

+ запропонувати свій приклад у пісочниці

<div class="box">width: calc(log(8, 2) * 60px)</div>

.box {
    /* log(8, 2) = 3, отже 180px */
    width: calc(log(8, 2) * 60px);
    background: #0172ad;
    color: #fff;
    padding: 8px;
}