Plac Zabaw CSS calc()

Testuj i eksperymentuj z wyrażeniami CSS calc() na żywo. Podgląd wyników, gotowe przykłady. Za darmo, 100% w przeglądarce.

320px 2560px
Przykłady
Podgląd
Wyjście CSS 
 
  
  
 
  
 
Dokumentacja
  
O CSS calc()
 
CSS calc() pozwala wykonywać obliczenia matematyczne w wartościach właściwości CSS. Możesz mieszać różne jednostki, np. procenty z pikselami.
 
Obsługiwane jednostki
 
px, rem, em, vh, vw, % — najczęściej używane. Można je mieszać w jednym wyrażeniu, np. calc(100% - 2rem).
 
Przykłady
 
calc(100% - 200px) — pełna szerokość minus stały margines. calc(50vh - 4rem) — połowa wysokości okna minus padding. calc(100vw / 3) — jedna trzecia szerokości ekranu.
 
Prywatność
 
Całe generowanie odbywa się w 100% w przeglądarce. Dane nie są wysyłane na serwer.
  
    
    
 ← Wróć do wszystkich narzędzi