Como aprender CSS?
Estudo programação a uns anos e sou bacharelando em TI e sinto que css é uma completa confusão pra mim.
Gostaria de ter algumas informações sobre como aprender e entender melhor o CSS.
Uma dificuldade que sinto é não saber o efeito que determinado atributo causa dentre centenas deles. Existe alguma documentação do CSS que facilite a leitura sendo mais direta?
Aprender CSS é como aprender usar um framework, você precisa ler a documentação sabe? CSS é super completo e tem diferentes formas de fazer diferentes coisas. O que eu recomendo fazer é ver um video no youtube explicando melhor(se for sua forma de aprender, eu aprendo mais lendo documentação) ou jogar no google o que você quer fazer e ir testando o que encontrar. De forma geral CSS é simples, mas pode sim ser muito complexo. Uma alternativa que eu gosto bastante é o Tailwind CSS, minha noção de CSS aumentou bastante depois que comecei a utilizar e a documentação deles é perfeita então dificilmente você iria se perder por lá sabe? Mas no final é tudo prática, pega um projetinho e vai indo e com o tempo você vai começar a decorar as coisas e vai fluir muito bem!! Sobre a documentação do css tem o mdn como o amigo ali falou.
Olá André!
Tambem tive muita dificuldade em CSS, tanto que iniciei um curso sobre desenvolvimento web e estava terminando a parte de CSS, mas sentia que não conseguia fazer do jeito certo, do jeito mais simples, então, comecei outro curso sobre o tema e, então, hoje sinto que tenho uma noção bem melhor.
O curso que me ajudou muito foi o do Curso em Vídeo, sendo a versão mais nova de HTML e CSS. Se você já tem a base eatabelecida de HTML pode começar a partir do capítulo que inicia o CSS. E, caso você se identifica mais com matéria escrita, sugiro os PDFs disponibilizados no repositório dele (embora esteja disponível até alguns capítulos apenas).
Algo que pra mim fez muita diferença foi, como sugerido pelo colega abaixo, estudar Box Model. E isso acho que vai ajudar bastante na sua dificuldade.
E, junto a isso, algo que ajudou foi parar de querer usar tudo que aprendia em todo projeto e simplificar ao máximo. Por exemplo, antes colocava classes e ids em todos os elementos e ficava uma bagunça (até dava certo, mas era o mais difícil), depois passei a fazer configurações mais padrões, apenas o necessário, nos elementos do html e apenas algumas classes e ids pontuais.
Outra coisa foi a forma de usar seletores. Antes, como mencionei, usava classe e id pra tudo, depois passei a usar os seletores como se fossem "urls", por assim dizer. Ex.: quando ia estilizar, um h2 que estava dentro do section que estava dentro do main eu usava o seletor main section h2 {...}. Assim, eu conseguia direcionar bem onde eu queria o estilo.
Se não consegui me expressar bem, por favor, da um toque aí que tento explicar melhor.
Diante da sua dificuldade, pense um pouco sobre se talvez não seja interessante lembrar da regra dos 80/20, 80% pode ser feito sabendo 20%. Procura os comandos que todo projeto tem, configurações básicas etc. Quando tiver dominando os 20% vai atrás dos 80%.
Se aceita uma indicação e inglês não é uma barreira (não deveria ser) gosto bastante do canal e dos cursos (alguns deles grátis) do Kevin Powell - https://www.youtube.com/@KevinPowell
Uma boa referência é a MDN ← e nesse link tem vários outros, pra tutoriais e documentação.
Está em inglês, mas também tem em português (tem um link no canto superior direito pra mudar o idioma). Porém, muitas páginas não estão bem traduzidas, e algumas tem até informações erradas ou faltando. Se possível, leia a versão em inglês mesmo.