CSS3 - calc()
No CSS3 temos um módulo que se chama "CSS Values and Units Module Level 3", este módulo tem o intuito de descrever os valores e unidades que as propriedades do CSS aceita.
Entre outras novidades ou nem tão novidades pois este módulo já existe desde Agosto/2012, criou-se três funções CSS destinadas a definir valores CSS. São elas: attr(), calc() e toggle().
Neste Post/Vídeo veremos a função calc(), que é suportada nas versões mais novas dos navegadores.
Para que serve?
Permite que sejam definidos valores que são resultados de uma expressão matemáticas.Quais operadores são válidos?
+ (soma)
- (subtração)
* (multiplicação)
/ (divisão)
Sintaxe:
seletor { propriedade: calc(expressão matemática); }
Exemplo:
Certo: calc(100% - 200px)
Errado: calc(100%-200px)
OBS: Nas expressões matemática as unidades CSS são aceitas para: ângulo, frequência, tempo, comprimento, números inteiros e fracionários, nas expressões é possível utilizar diferentes unidades de medida, lembre sempre de deixar espaços em branco entre os valores e os operadores.
Comentários
Postar um comentário