Berekeningen Uitvoeren met Sass Numerieke Operatoren
We kunnen wiskundige berekeningen uitvoeren op getallen. Sass ondersteunt alle basisrekenkunde zoals optellen (+), aftrekken (-), vermenigvuldigen (*) en delen (/).
width: 100px + 10px; /* 110px */
height: 100% - 20%; /* 80% */
Voor optellen en aftrekken is het belangrijk dat de waarden dezelfde eenheden hebben (bijv. %, px).
animation-duration: 200ms * 3; /* 600ms */
flex-basis: 100% / 4; /* 25% */
Voor vermenigvuldigen en delen is het essentieel dat één waarde geen eenheid heeft. Sass kan geen deling uitvoeren met pixels of percentages.
Wiskundige bewerkingen met variabelen
We kunnen eenvoudig variabelen betrekken bij de berekeningen als de variabele een geldige waarde heeft.
Stel dat we een dubbele marge aan het item willen toevoegen:
$defaultMargin: 30px;
.item {
margin: $defaultMargin * 2; /* Result is 60px */
}
Bedankt voor je feedback!
Vraag AI
Vraag AI
Vraag wat u wilt of probeer een van de voorgestelde vragen om onze chat te starten.
Can you explain why units must match for addition and subtraction in Sass?
What happens if I try to multiply two values with units in Sass?
Can you show more examples of using variables in Sass calculations?
Awesome!
Completion rate improved to 2.04Berekeningen Uitvoeren met Sass Numerieke Operatoren
Veeg om het menu te tonen
We kunnen wiskundige berekeningen uitvoeren op getallen. Sass ondersteunt alle basisrekenkunde zoals optellen (+), aftrekken (-), vermenigvuldigen (*) en delen (/).
width: 100px + 10px; /* 110px */
height: 100% - 20%; /* 80% */
Voor optellen en aftrekken is het belangrijk dat de waarden dezelfde eenheden hebben (bijv. %, px).
animation-duration: 200ms * 3; /* 600ms */
flex-basis: 100% / 4; /* 25% */
Voor vermenigvuldigen en delen is het essentieel dat één waarde geen eenheid heeft. Sass kan geen deling uitvoeren met pixels of percentages.
Wiskundige bewerkingen met variabelen
We kunnen eenvoudig variabelen betrekken bij de berekeningen als de variabele een geldige waarde heeft.
Stel dat we een dubbele marge aan het item willen toevoegen:
$defaultMargin: 30px;
.item {
margin: $defaultMargin * 2; /* Result is 60px */
}
Bedankt voor je feedback!
