Recomendação de curso:

função sin() do CSS

Definição e uso do função sin() A função retorna o valor seno de um número (ângulo).

O valor do seno do ângulo sempre retorna um valor entre -1 e 1.

exemplo

no calc() usada em função sin() Para definir a largura e altura de três elementos <div>:

div.a {
  width: calc(sin(0.25turn) * 120px);
  height: calc(sin(30deg) * 120px);
  background-color: salmon;
  margin-bottom: 25px;
}
div.b {
  width: calc(sin(90) * 120px);
  height: calc(sin(2*1.125) * 120px);
  background-color: green;
  margin-bottom: 25px;
}
div.c {
  width: calc(sin(pi/2) * 120px);
  height: calc(sin(pi/2) * 120px);
  background-color: maroon;
}

Experimente você mesmo

Sintaxe do CSS

sin(ângulo)

Detalhes técnicos

Suporte do navegador

Os números na tabela representam a versão do navegador que suporta completamente a função pela primeira vez.

Páginas relacionadas

Referência:Função acos() do CSS

Referência:Função asin() do CSS

Referência:Função atan() do CSS

Referência:Função atan2() do CSS

Referência:Função calc() do CSS

Referência:Função cos() do CSS

Referência:Função exp() do CSS

Referência:Função hypot() do CSS

Referência:Função log() do CSS

Referência:Função mod() do CSS

Referência:Função pow() do CSS

Referência:Função sqrt() do CSS

Referência:Função tan() do CSS