Συνάρτηση calc

Η συνάρτηση calc επιτρέπει τον υπολογισμό τιμών των ιδιοτήτων CSS. Η συνάρτηση ως παράμετρο δέχεται μια μαθηματική έκφραση, το αποτέλεσμα της οποίας μπορεί να χρησιμοποιηθεί ως τιμή ιδιότητας CSS. Η έκφραση μπορεί να περιλαμβάνει τους τελεστές +, -, *, /.

Σύνταξη

cssεπιλογέας {
  ιδιότητα: calc(έκφραση);
}

Παράδειγμα

Ας κάνουμε το πλάτος του μπλοκ ίσο με 100% του πλάτους του γονέα, μείον 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;
}

Результат:

Δείτε επίσης