O C do CSS começando a ter um novo sentido
Desde o ano passado foi comentado sobre a nova propriedade do CSS, o layer() que tem como objetivo de trabalhar melhor a especificidade e a ordem dos seletores e regras nas folhas de estilo. Para quem não sabe o CSS é procedural, ou seja, ele vai executar as coisas exatamente na ordem em que você vai escrever. Mas o layer(), até então, pretende mudar um pouco essa dinâmica.
Mas como?
Com ele podemos controlar melhor as camadas de estilo e a ordem de importância, então sabe aquele !important que você joga como última saída pra sobrepor uma customização que tem um seletor muito mais acima do seu? Um outro exemplo de uso/solução seria para os casos em que usávamos o z-index para reordenar blocos (sobrepor um ao outro). Com o layer() conseguiríamos redefinir melhor quem vai ter alta, média e baixa prioridade. Isso vai ser bom para quando trabalharmos com bibliotecas de terceiros, por exemplo.
A proposta dessa propriedade é interessante e vale ficarmos de olho. No momento só funciona apenas para as versões 99-100 do Chrome e muito em breve no Firefox. De qualquer forma isso vai nos trazer mais facilidade, controle e organização na construção das nossas folhas de estilo.
Vou deixar abaixo uns links bem interessantes e mais completos sobre o assunto (em inglês):
- https://caniuse.com/css-cascade-layers
- https://developer.mozilla.org/en-US/docs/Web/CSS/@layer#browser_compatibility
- https://www.smashingmagazine.com/2022/01/introduction-css-cascade-layers/
Até a próxima!
Top comments (0)