CSS Nesting: Minha Opinião Sincera
CSS Nesting é a nova feature de CSS que chegou com tudo! Conheça os macetes, pegadinhas e marotagens de Aninhamento CSS.
Uma das features preferidas de quem usa pré-processadores CSS, como Sass, é a capacidade de usar regras CSS aninhadas. A boa notícias é que agora isso também é possível usando CSS puro!
Ou seja, agora é possível aninhar uma regra de estilo dentro de outra regra de estilo, permitindo que o seletor da regra interna faça referência aos elementos correspondentes à regra externa. Esse recurso permite que estilos relacionados sejam agregados em uma única estrutura dentro do documento CSS, melhorando a legibilidade e a manutenção.
⭐ Garanta sua vaga na próxima turma do curso de CSS
https://www.cssalemdosensocomum.com.br/
Este novo módulo CSS traz a capacidade de aninhar uma regra de estilo dentro de outra, com o seletor da regra filho relativo ao seletor da regra pai. Isso aumenta a modularidade e a capacidade de manutenção das folhas de estilo CSS, melhorando:
Organização
Facilidade de leitura
Manutenção
Refatoração
Redução do tamanho e peso dos arquivos
Mas nem tudo funciona como a maioria de nós, front-end designers, poderíamos supor. Existem muitas diferenças entre o aninhamento nativo de CSS e aninhamento de pré-processadores.
É por isso que você deve assistir esse vídeo sobre CSS Nesting, para conhecer as diferença, regras de uso, macetes, pegadinhas e marotagens do tão esperado aninhamento nativo de CSS.
💬 Entre na comunidade exclusiva dpw para conversar sobre o conteúdo deste vídeo
/ discord
✏️ Combinação de seletores CSS
https://desenvolvimentoparaweb.com/cs...
✏️ A maneira 100% correta de fazer breakpoints em CSS
https://desenvolvimentoparaweb.com/cs...
🌐 CSS Nesting Module | W3C
https://www.w3.org/TR/css-nesting-1/
==========
⏱️ Timestamps
00:00 Intro
00:25 Uso básico de CSS Nesting
03:16 The Inception Rule
04:03 Nesting Selector (Seletor de Aninhamento)
06:41 Aninhamento, at-rules e media queries
07:56 Sintaxe válida de aninhamento
09:36 Segredo para entender CSS Nesting
12:31 Macete para regras aninhadas
14:31 Seletor de Aninhamento e pseudo-elementos
15:19 Aninhamento e interpolação de caracteres
17:07 Minha conclusão sobre CSS Nesting
==========
📷 Equipamentos usados para gravar este vídeo
Sony Alpha a6400: https://amzn.to/3LZ9Zkv
Cartão 128GB Extreme PRO SDXC: https://amzn.to/3rqVPRg
Tripé Weifeng WT6734: https://amzn.to/3LYWUb4
==========
Assine o canal! http://bit.ly/dpw-youtube
Facebook: / desenvolvweb
Instagram: / desenvolvweb
Twitter: / desenvolvweb
Conheça o blog desenvolvimento para web: https://desenvolvimentoparaweb.com/
Watch video CSS Nesting: Minha Opinião Sincera online without registration, duration hours minute second in high quality. This video was added by user dpw 28 June 2023, don't forget to share it with your friends and acquaintances, it has been viewed on our site 2,344 once and liked it 263 people.