Menu
Coddy logo textTech
COMEÇAR A APRENDER
flag Pt iconPortuguêsdown icon
html iconParte do Journey de HTMLPopularJornada

Aprenda CSS

Um curso de CSS gratuito e interativo. Você estiliza HTML de verdade em cada aula - seletores, o box model, cores, fontes, flexbox, grid, design responsivo - com uma prévia ao vivo enquanto você digita e um certificado gratuito ao concluir. Faz parte da jornada mais ampla de HTML, então o contexto de marcação de que o CSS precisa está ali mesmo.

COMEÇAR A APRENDER(é grátis)
Ver programaPlayground de Styling with CSS

281,604+ codders inscritos

119 lições104 desafios583 perguntas de quiz

  • Ideal para iniciantes
  • sparkles iconAjuda de codificação com IA
  • hint iconLições interativas e práticas
  • volume On iconNarração em áudio em todas as lições
  • quiz iconQuestionários para testar seu conhecimento
  • certificate iconCertificado grátis de conclusão

Programa

2 seções3 projetos119 lições104 desafios583 perguntas de quiz

Esta seção faz parte do Journey de HTML. O programa completo tem mais seções - clique em qualquer prévia abaixo para vê-la na página do Journey.

  1. Seção 1Fundamentals60 lições
  2. Seção 2

    Styling with CSS

    Começar seçãoIniciarExpandirRecolher    Bring your web pages to life with colors, layouts, and styles76 lições100 desafios419 perguntas3 projetos

    Introdução

    5 lições540

    Adicionando CSS

    4 lições725

    Seletores Básicos

    7 lições1247

    Fundamentos de Texto

    8 lições1450

    Cores e Planos de Fundo

    5 lições834

    Cardápio de Café

    Projeto3 lições1

    Modelo de Caixa Parte 1

    6 lições943

    Modelo de Caixa Parte 2

    5 lições834

    Flex Box

    6 lições943

    Formulário de Login

    Projeto4 lições1

    Técnicas de Layout

    7 lições1151

    Fundamentos do Design Responsivo

    6 lições1052

    Página Web de Tonga

    Projeto6 lições1

    Desafios Finais

    4 lições4
  3. Seção 3

    CSS Mastery

    Começar seçãoIniciarExpandirRecolher    Take you css skills to the next level!43 lições40 desafios164 perguntas

    Domínio de Seletores – Combinação

    6 lições539

    Pseudo-classes Interativas

    5 lições431

    Pseudo-classes estruturais

    5 lições432

    Projeto de Menu Dropdown

    4 lições4

    Efeitos visuais

    5 lições536

    Landing Page

    5 lições5

    Construa com CSS Grid

    4 lições426

    Site Flavor Fiesta

    4 lições4

    Desafios Finais

    5 lições5
  4. Seção 4Practical Frontend35 lições
  5. Seção 5JavaScript in Action27 lições
Ver o programa completo do Journey de HTML
O que você recebe
Tudo o que você vai usar para aprender a programar

Learn by Doing

Write real code, query databases, build websites, and master AI prompts. Our interactive lessons cover every skill modern developers need.

playground.js
Code Editor
1const greeting = "Hello, Coddy!"
2function sayHi(name) {
3    return greeting + " " + name
4}
5
bottombar Collapse icon
Test #1test Case Success icon
Test #2test Case Success icon
Test #3test Case Failure icon
Input
"Alex"
Output
"Hello, Coddy! Alex"

Build Your Coding Streak

Stay consistent and watch your progress grow! Track your daily coding habit, protect your streak with freeze days, and earn rewards for showing up every day.

12 days streak

Return tomorrow to keep your streak!

fire Filled icon
left icon

January 2026

right icon

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

21

22

23

24

25

26

27

28

29

30

product Double Or Nothing icon

Double or Nothing

Day 5 of 7

fire Freeze icon

Streak Freeze

2 left

Code Anywhere, Anytime

Take your coding journey on the go! No setup, no downloads - just open and start coding. Available on iOS, Android and Web with 4.9 star ratings.

Python
7Streak
250Score
5Energy
Variables
journey Hex Done Base iconjourney Hex Done Shadow iconjourney Hex Done Top iconjourney Lesson Done icon
journey Path Right Done icon
journey Hex Done Base iconjourney Hex Done Shadow iconjourney Hex Done Top iconjourney Lesson Done icon
journey Path Left Done icon
journey Hex Active Base iconjourney Hex Active Shadow iconjourney Hex Active Top iconjourney Lesson Theory Challenge icon
CONTINUE
journey Path Right icon
journey Hex Locked Base iconjourney Hex Locked Shadow iconjourney Hex Locked Top iconjourney Lesson Theory Challenge icon
journey Path Left icon
journey Hex Locked Base iconjourney Hex Locked Shadow iconjourney Hex Locked Top iconjourney Lesson All icon
Journey
Goals
Leaderboard
Profile
4.9
StarStarStarStarStar
Rating

You're Not Alone in This

Compete on global leaderboards, invite friends to earn rewards, and celebrate each other's wins. Coding is better with friends!

Challenger League
Challenger LeagueTop 7 advance
leaderboard First icon1
avatar 1 icon
fire Filled icon
Alex7+ Days
2840
leaderboard Second icon2
avatar 2 icon
fire Filled icon
Jordan7+ Days
2650
leaderboard Third icon3
avatar 3 icon
fire Filled icon
Sam7+ Days
2420
4
avatar 4 icon
Casey
2180
5
avatar placeholder icon
fire Filled icon
Morgan7+ Days
1950
leaderboard Arrow Up iconPromotion zoneleaderboard Arrow Up icon

Every way to learn

Read, listen, test yourself, ask the AI, or look up anything you've already covered. Every lesson meets you where you are.

Intro to Variables
Audio

A variable is a named container that stores a value you can reference later in your program.

In Python, you create one by writing the name, an equals sign, then the value you want to store.

The value can change over time - reassigning the name simply points it to a new value.

1xSarah

Prove Your Skills

Earn certificates for every course you complete. Add them to your LinkedIn profile and resume to showcase your coding expertise to employers.

CoddyCertificate of Completion
This certifies thatJohn Doehas successfully completed
PythonPython Fundamentals
Verified
DateJan 2026
LinkedInAdd to LinkedIn

Por que aprender CSS com a Coddy

  • Escreva CSS no seu navegador e veja a página se reestilizar ao vivo. Sem etapa de build, sem configurar um editor. Cada mudança em um seletor ou propriedade aparece instantaneamente, então você vê o que cada regra realmente faz.
  • O essencial do CSS: seletores e especificidade, o box model, posicionamento, flexbox, CSS grid, transições, media queries e design responsivo. O CSS de que todo desenvolvedor front-end precisa no dia a dia.
  • As dicas de IA ajudam você a depurar as coisas que sempre confundem - surpresas de especificidade, estouros de layout, comportamentos estranhos do flexbox - sem estragar a solução, para que o CSS se torne intuitivo em vez de mágico.
  • Certificado de CSS gratuito ao concluir a seção. Combina naturalmente com os cursos de HTML e JavaScript para uma base completa de front-end.

Perguntas frequentes sobre aprender CSS

O que é CSS?

CSS (Cascading Style Sheets) é a linguagem que controla a aparência das páginas HTML - cores, fontes, espaçamento, layout, animações, comportamento responsivo em diferentes tamanhos de tela. O HTML define o que está na página; o CSS define como ela é apresentada.

CSS é difícil de aprender?

O CSS básico - seletores, cores, fontes, o box model - é fácil de pegar em algumas horas. As partes mais difíceis vêm depois: regras de especificidade, layouts com flexbox e grid e fazer tudo ficar bom em qualquer tamanho de tela. O curso as introduz em passos pequenos com uma prévia ao vivo, então você vê exatamente o que cada regra faz.

Devo aprender HTML antes de CSS?

Sim. O HTML define a estrutura de uma página; o CSS a estiliza. Sem HTML, você não tem nada para estilizar. É por isso que esta seção de CSS faz parte da jornada de HTML - a seção de fundamentos de HTML vem primeiro, e depois você passa a maior parte da jornada estilizando-o.

Qual é a diferença entre CSS, Flexbox e Grid?

Flexbox e Grid são módulos de layout dentro do CSS - não são tecnologias separadas, são recursos do CSS. O Flexbox é melhor para layouts unidimensionais (uma linha de cards, uma barra de navegação). O Grid é melhor para layouts bidimensionais (uma página inteira, um layout de cards complexo). A maioria dos sites reais usa os dois, e o curso aborda quando recorrer a cada um.

Posso aprender CSS online de graça?

Sim. A seção interativa de CSS é gratuita - aulas completas, exercícios de programação, uma prévia ao vivo e um certificado. Tudo roda no navegador, então você não precisa instalar nenhum editor ou ferramenta para começar.

Recebo um certificado após o curso de CSS?

Sim. Concluir a seção de CSS dá a você um certificado de conclusão gratuito. Uma prova verificável que você pode adicionar ao seu currículo ou compartilhar no LinkedIn junto aos certificados de HTML e JavaScript como parte de um portfólio de front-end.
Coddy programming languages illustration

Learn Styling with CSS with Coddy

COMEÇAR