Die CSS-Funktion calc() ermöglicht es Ihnen, Berechnungen durchzuführen, um CSS-Eigenschaftswerte zu ermitteln. Sie können Berechnungen mit Längen-, Frequenz-, Winkel- oder Zeitwerten durchführen.
Um die calc() Funktion zu verwenden, geben Sie einfach die Funktion calc() in das CSS-Style ein und dann die mathematische Operation, die Sie ausführen möchten. Innerhalb der Klammern können Sie Addition (+), Subtraktion (-), Multiplikation (*) und Division (/) verwenden.
Hier ist ein einfaches Beispiel dafür, wie Sie die calc() Funktion verwenden können, um die Breite eines Elements zu setzen:
```css
div {
width: calc(100% – 80px);
}
```
In diesem Beispiel würde der `div` eine Breite von 100% des Elternelements minus 80px haben.
Eine weitere häufige Verwendung von calc() könnte sein, um flexible Ränder zu erzeugen:
```css
.box {
margin: calc(1em – 5px);
}
```
In diesem Fall wird der Rand um das box-Element auf 1em minus 5px gesetzt.
Eines der großartigen Dinge an der calc() Funktion ist, dass sie auch verschiedene Einheiten mischen kann, die normalerweise nicht miteinander gemischt werden könnten, wie z.B. Prozent und Pixel.