Duvida Sobre Sass Function #1598
Unanswered
evertonProgramadorCriativo
asked this question in
Perguntas e Respostas
Replies: 1 comment
-
// declaração da função passando nome(pow) e os parâmetros($base, $exponent)
@function pow($base, $exponent) {
// variável para armazenar o resultado final da função
$result: 1;
/*
o for é uma estrutura de repetição, ou seja vc vai definir quantas vezes vai repetir o bloco de instrução
$_ é uma variável que serve como contador, vc pode utilizar ou não
from 1 indica que vai começar do 1 (não faria sentido colocar outro número por causa da exponenciação)
through $exponent indica quantas vezes vai ser repetido, aqui recebe o parâmetro $exponent
*/
@for $_ from 1 through $exponent {
// cada vez que fizer uma repetição, o $result recebe um novo valor
$result: $result * $base;
}
@return $result;
}
.sidebar {
float: left;
/*
aqui chama a função passando os parâmetros, onde 4 é $base e 3 é $exponent, ou seja o for vai repetir 3 vezes
$result: 1 * 4; 1 é o valor inicial do $result declarado lá na função, é feito a multiplicação e o $result recebe o resultado, ou seja, 4
$result: 4 * 4;
$result: 16 * 4;
depois das 3 repetições a função retorna o valor final do $result que é 64
*/
margin-left: pow(4, 3) * 1px;
} Não sei se expliquei da melhor maneira, se ficar com dúvida, só falar que tento melhorar |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Uh oh!
There was an error while loading. Please reload this page.
-
Ola, gostaria de entender essa função em sass , e como eu poderia colocar variaveis de estilo
em funções em sass , ser possivel fazer uma demonstração de script para melhor entendimento ,estou olhando a documentação e gostaria de entender esse exemplo
------------------------------------LINK--------------DOC--------------------------------
https://sass-lang.com/documentation/at-rules/function
Sass-Lang
Sass: @function
Syntatically Awesome Style Sheets
@function pow($base, $exponent) {
$result: 1;
@for $_ from 1 through $exponent {
$result: $result * $base;
}
@return $result;
}
.sidebar {
float: left;
margin-left: pow(4, 3) * 1px;
}
Beta Was this translation helpful? Give feedback.
All reactions