CSS, de onde surge a aparência das paginas?

O design de site ou as interfaces de uma aplicação, além de serem planejadas por um profissional do Web Design se tornam parte do código do aplicativo, normalmente através do CSS(Cascading Style Sheets) uma linguagem usada para estilizar linguagens de marcação como o HTML e dar uma boa aparência aos aplicativos.

CSS é uma linguagem que se utiliza de regras e seletores para estilizar os elementos de uma determinada página, a estilização dos elementos se deve pelas propriedades do CSS.

O CSS tem uma função indispensável no desenvolvimento-web, sendo essa a de tornar os sites mais acessíveis com contraste de cores tamanho de fontes e interface auto explicativas, também pode reduzir problemas na manutenção por separar o design do restante do código, por último CSS é essencial para tornar sites responsivos, o que significa que um site pode reorganiza suas propriedades para que seus usuários acessem através de qualquer dispositivo com qualquer tamanho de tela.

O CSS consegue aplicar suas propriedades aos elementos graças aos seletores, que são em resumo a TAG de um elemento, um id ou uma classe, além do seletor global que é representado por um *(asterisco). Uma classe é atribuída ao elemento HTML da forma a seguir:

A diferença resumida entre id e classe é que o id por ser mais específico tem uma hierarquia maior o que significa que quando um elemento tem propriedades conflitantes em seu id e sua classe, a propriedade definida no id é aplicada, por fim a mesma classe pode ser dada para vários elementos, enquanto o id deve ser único. Uma vez que o seletor for definido será hora de definir as propriedades para o elemento, essas propriedades poderão ser alteração no tamanho, preencher espaços, adicionar margem, alterar fontes, cores e muito mais.

Para usar CSS em seu Studio basta criar um arquivo .css e conecta-lo ao arquivo html, no artigo: A UTILIDADE, DEFINIÇÃO E IMPORTÂNCIA DO HTML foi mostrado como conectar um arquivo css ao html. Após "linkar" o arquivo css no html, basta escrever as regras usando seletores e propriedades como mostrado a seguir.

Para por em css o código disponível na página de componentes, é necessário apenas copiar toda a parte de css e colar em seu arquivo css.

Com tudo isso, o ponto central do artigo em questão e o porque de CSS ser explicado no C+S é de que, para além de componentes de interface e estilos para os mesmos, o site visa facilitar o aprendizado de pessoas interessadas em web-desenvolvimento, criando assim um ambiente onde você possa ter inspirações, exemplos e praticar. Espero ter ajudado com esse artigo e também que o C+S seja de utilidade em sua caminhada, boa sorte a todos!