Qual a diferença dessas classes?E que informar em cada uma delas?
.produtos{
}
.produtos li {
}
nav{
}
nav li{
}
nav a{
}
Qual a diferença dessas classes?E que informar em cada uma delas?
.produtos{
}
.produtos li {
}
nav{
}
nav li{
}
nav a{
}
Oi, Vinicius, tudo bem?
Vamos lá:
.produtos{ } Essa é uma classe que está estilizando as especificações do que foi definido como produtos no HTML.
.produtos li { } Essa é classe produtos mas quem está sendo estilizada é tag li que trás uma lista de elementos no HTML. Nesse caso, o instrutor preferiu não fazer uma classe somente para a lista, e sim usar a tag para não sujar o HTML.
nav{ } é a tag que menção a uma seção que aponta para outras páginas ou links.
nav li{ } Aqui segue a lógica de produtos li. Estilização de uma tag nav e li , que é uma lista de links dentro da tag nav.
nav a{ } E aqui é especificamente a estilização dos links, literalmente.
Esses links podem ajudar mais:/
https://developer.mozilla.org/pt-BR/docs/Web/HTML/Element/nav
https://developer.mozilla.org/pt-BR/docs/Web/HTML/Element/a
https://developer.mozilla.org/pt-BR/docs/Web/HTML/Element/li
Espero ter te ajudado!
Complementando e falando mais um pouco sobre a .produtos li { }, o css funciona em cascata, o que quer dizer que você pode acessar elementos mais internos caminhando pelos mais externos. A classe em questão é a .produtos e dentro de uma div com essa classe existia uma tabela (li). .produtos li estiliza em especifico somente a tabela (li) dentro da div cujo a classe é produtos. Caso dentro do li ainda existisse outra tag, por exemplo uma tag p, ela poderia ser estilizada com .produtos li p {}.