Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

Diferença entre variáveis e placeholder?

Não sei se entendi corretamente, mas a diferença entre os dois seria que variáveis só posso guardar um único valor e o placeholder eu guardo propriedades? Alguém me ajuda a esclarecer isso?

3 respostas
solução!

Fala ai Gisele, tudo bem? Na verdade são comparações e coisas diferentes.

As variaveis vão armazenar um valor para ser reaproveitando e compartilhado em demais partes do código.

Já o placeholder vai guardar um grupo de estilo que será aplicados e juntados com os elementos final, a comparação poderia ser entre placeholder e mixin.

Espero ter ajudado.

Matheus, minha dúvida é justamente sobre placeholder e mixin. Você saberia me explicar a diferença?

Fala Tarique, a diferença é em como serão ou não agrupados os seletores no CSS final:

  • placeholder: Vai agrupar e juntar os seletores em um unico no CSS final.
  • mixin: Vai manter o agrupamento e seletor de acordo com o código fonte.

Exemplos:

Placeholder:

%p1 {
    display: inline;
}

.p1 {
    @extend %p1;
}

.p2 {
    @extend %p1;
}

.p3 {
    @extend %p1;
}

// resultado
.p3, .p2, .p1 {
  display: inline;
}

Mixin:

@mixin m1() {
    display: block;
}

.tst1 {
    @include m1;
}

.tst2 {
    @include m1;
}

.tst3 {
    @include m1;
}

// resultado
.tst1 {
  display: block;
}

.tst2 {
  display: block;
}

.tst3 {
  display: block;
}

Espero ter ajudado.