Gerador de transformação CSS para pessoas preguiçosas.
Defina a escala, gire, traduza e incline e assista à visualização ao vivo para obter a visualização desejada.
Evite definir valores extremos para a propriedade skew porque a visualização pode cobrir o painel de configurações. Nesta situação, você terá que atualizar a página.
Dimensionar, girar, traduzir e inclinar
A escala funciona da mesma forma que você aumentaria e diminuiria o elemento-alvo. O valor da escala padrão é 1, que funciona como um multiplicador do tamanho original. Isso significa que 0,5 metades enquanto 2 dobra a seção.
Gire o elemento no sentido horário com a segunda propriedade definida em graus. Girar 180 ° coloca o objeto de cabeça para baixo enquanto a captura 360 ° volta à sua posição vertical original. Defina qualquer valor positivo ou negativo ou mesmo decimais.
Traduzir desloca o elemento com pixels relacionados à sua posição original. O valor X horizontalmente enquanto Y verticalmente quando há atributo de rotação é zero.
Incline os objetos em seus eixos horizontal (X) ou vertical (Y).
Transformação CSS explicada
A propriedade transform CSS permite girar, dimensionar, inclinar e traduzir um elemento. Ele modifica o espaço de coordenadas do modelo de formatação visual CSS.
Definição e Uso
A propriedade de transformação aplica uma transformação 2D ou 3D a um elemento. Esta propriedade permite girar, dimensionar, mover, inclinar, etc., elementos.
Suporte para navegador
Os números na tabela especificam a primeira versão do navegador que oferece suporte total à propriedade.
Números seguidos por -webkit-, -moz- ou -o- especificam a primeira versão que funcionou com um prefixo.
Sintaxe
transform: none|transform-functions|initial|inherit;