Calc funkcija

Funkcija calc ļauj veikt CSS īpašību vērtību aprēķinus. Funkcija kā parametru pieņem matemātisku izteiksmi, kuras aprēķina rezultātu var izmantot kā CSS īpašības vērtību. Izteiksme var ietvert operatorus +, -, *, /.

Sintakse

cssselektors {
  īpašība: calc(izteiksme);
}

Piemērs

Izveidosim tā, lai bloka platums būtu vienāds ar 100% no vecāka elementa platuma, mīnus 50px:

html<div id="parent">
  <div id="child"></div>
</div>

css#child {
  width: calc(100% - 50px);
  height: 100px;
  margin: 0 auto;
  border: 1px solid red;
}
#parent {
  border: 1px solid green;
}

Результат:

Skatiet arī