Funkcja calc() CSS

Definicja i zastosowanie

CSS calc() Funkcja wykonuje obliczenia i używa wyniku jako wartości atrybutu.

Przykład

Użyj calc() Oblicz szerokość elementu <div>:

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

Spróbuj sam

Gramatyka CSS

calc(expression)
Wartość Opis
expression

Wymagane. Wyrażenie matematyczne, którego wynik zostanie użyty jako wartość.

Można używać następujących operatorów: +, -, *, /.

Szczegóły techniczne

Wersja: CSS3

Wsparcie przeglądarki

Liczby w tabeli oznaczają pierwszą wersję przeglądarki, która w pełni obsługuje tę funkcję.

Chrome Edge Firefox Safari Opera
26 9 16 7 15

Strony związane

Odniesienie:Funkcja acos() CSS

Odniesienie:Funkcja asin() CSS

Odniesienie:Funkcja atan() CSS

Odniesienie:Funkcja atan2() CSS

Odniesienie:Funkcja cos() CSS

Odniesienie:Funkcja exp() CSS

Odniesienie:Funkcja hypot() CSS

Odniesienie:Funkcja log() CSS

Odniesienie:Funkcja mod() CSS

Odniesienie:Funkcja pow() CSS

Odniesienie:Funkcja sin() w CSS

Odniesienie:Funkcja sqrt() w CSS

Odniesienie:Funkcja tan() w CSS