Agora que você já sabe por que o CSS foi criado, chegou a hora de entender o que ele é de verdade e como o navegador usa CSS para transformar HTML em visual.
Essa aula cria o modelo mental que vai te acompanhar pelo curso inteiro.
O que é CSS?
CSS significa Cascading Style Sheets (Folhas de Estilo em Cascata).
Na prática, CSS é a linguagem usada para definir:
- Cores
- Fontes
- Tamanhos
- Espaçamentos
- Layout
Enquanto o HTML descreve o que é o conteúdo, o CSS descreve como esse conteúdo deve aparecer.
CSS não cria conteúdo
Um ponto muito importante:
Se algo não existe no HTML, o CSS não consegue “inventar”. Por isso, HTML bem estruturado é sempre o primeiro passo.
Como o CSS funciona?
O CSS funciona através de regras de estilo. Cada regra diz ao navegador:
- Quem será estilizado
- O quê será alterado
- Como será exibido
Uma regra CSS tem três partes fundamentais.
A estrutura de uma regra CSS
p { color: blue; } Vamos entender cada parte:
- Seletor → indica qual elemento será estilizado (
p) - Propriedade → o que será alterado (
color) - Valor → como será alterado (
blue)
O navegador como intérprete de CSS
Assim como acontece com o HTML, o navegador:
- Lê o CSS
- Interpreta as regras
- Aplica os estilos aos elementos correspondentes
Se várias regras se aplicam ao mesmo elemento, o navegador decide qual usar com base em regras bem definidas (cascata, herança e especificidade — veremos isso já já 👀).
CSS não “executa”
CSS não funciona como uma linguagem de programação.
Ele descreve estados visuais. O navegador resolve como aplicar essas descrições.
HTML + CSS trabalhando juntos
Imagine este HTML:
<p>Olá, Contém Bits!</p> E este CSS:
p { color: #428bca; font-size: 18px; } O HTML define o conteúdo. O CSS define a aparência. Cada um faz seu papel. No exemplo acima o parágrafo terá a cor azul (#428bca) e o tamanho de fonte fixado em 18 pixels.
Modelo mental correto
Se a estrutura for boa, o visual pode mudar quantas vezes quiser.
💾🧠 Resumo da aula para nunca mais esquecer
- CSS define a aparência do conteúdo HTML
- Ele funciona por regras de estilo
- Uma regra tem seletor, propriedade e valor
- CSS é declarativo, não programável
- HTML e CSS têm papéis diferentes e complementares
Na próxima aula, vamos aprender as formas de aplicar CSS e entender qual usar em cada situação.
HARDWARE
Entendendo o seu computador
O que há dentro do meu computador?
Existem alguns componentes fundamentais presentes dentro do seu computador e é muito importante que você conheça um pouco sobre eles, seja para argumentar com algum vendedor durante a compra de um novo PC ou para identificar alguma atitude desleal de algum técnico que esteja te passando um orçamento para reparo. Na seção Raio-X aqui do Contém Bits você pode conhecer e entender mais detalhadamente sobre cada componente, ou também pode clicar abaixo no componente que deseja, para conhecê-lo melhor.
Você Sabia?
Duck Hunt
Ao completar o nível 99 do jogo Duck Hunt, para Nintendo, o jogo retorna ao primeiro nível, mas um bug impede que se acerte os patos neste recomeço. Este é um exemplo do que é chamado no mundo dos games de "Kill Screen".
Final Fantasy X
O jogo Final Fantasy X para o Sony Playstation 2 vendeu, apenas no dia do seu lançamento, 1.455.732 cópias, estabelecendo um recorde de vendagem para as primeiras 24 horas de um game. Méritos da SquareSoft, que desenvolveu um excelente produto!
ENIAC
O ENIAC, primeiro computador valvulado do mundo, possuía 17.000 válvulas, 500.000 pontos de solda, 30 toneladas de peso e ocupava uma área de 180 metros quadrados. Clique aqui e conheça mais sobre a história dos computadores.
Cuidados com o notebook
Utilizar seu notebook em camas, sofás ou qualquer superfície macia pode obstruir as entradas e saídas de ar, elevando a temperatura e provocando danos a diversos componentes. Utilize-o sempre sobre uma superfície rígida. Saiba mais aqui.
Mouse
O mouse foi criado em 9 de dezembro de 1968, por um americano chamado Douglas Engelbart, que o batizou de "XY Position Indicator for a Display System". Conheça a história do mouse clicando aqui.










