Aula 1: Introdução ao CSS

Bem-vindo à primeira palestra de "Basic to Brilliance" - sua jornada para dominar CSS começa aqui!

O que é CSS?

CSS, ou Cascading Style Sheets, é a linguagem usada para descrever a apresentação de uma página web. Embora o HTML forneça a estrutura e o conteúdo, o CSS é o que torna as páginas da web atraentes e fáceis de usar. Ele controla o layout, cores, fontes, espaçamento e muito mais.

Por que o CSS é importante?

• Separação de preocupações: CSS permite separar o conteúdo (HTML) da apresentação (CSS), tornando seu código mais limpo e fácil de manter.
• Consistência: Você pode aplicar estilos consistentes em várias páginas da web vinculando um único arquivo CSS.
• Design responsivo: CSS é essencial para criar sites que ficam bem em todos os dispositivos, de desktops a smartphones.

Sintaxe CSS básica

CSS é composto de regras que visam elementos HTML. Cada regra consiste em um seletor e um bloco de declaração.

selector {
  property: value;
}

• Seletor: Destina-se ao elemento HTML que você deseja estilizar.
• Propriedade: O aspecto do elemento que você deseja alterar (por exemplo, cor, tamanho da fonte).
• Valor: O valor específico que você deseja aplicar à propriedade.

Exemplo:

Digamos que você deseja alterar a cor de todos os elementos

para azul.

HTML:

Hello, World!

CSS:

h1 {
  color: blue;
}

Esta regra simples transformará o texto em todos os elementos

em azul.

Adicionando CSS ao HTML

Existem três maneiras principais de adicionar CSS ao seu documento HTML:

1. CSS inline: Diretamente no elemento HTML.

   
Hello, World!

1. CSS interno: Dentro de uma tag

1. CSS externo: Link para um arquivo CSS externo do seu documento HTML.

styles.css:

   h1 {
     color: blue;
   }

Praticar Exercício

• Crie um arquivo HTML com alguns elementos diferentes como

  ,

  e

  .
• Aplique diferentes cores, tamanhos de fonte e cores de fundo a esses elementos usando todos os três métodos: CSS embutido, interno e externo.
• Experimente diferentes propriedades para ver como elas afetam a aparência dos seus elementos.

---

Próximo: Na próxima palestra, nos aprofundaremos em Seletores e propriedades e aprenderemos como direcionar e estilizar diferentes elementos em sua página da web. Fique atento!

---

Esta primeira palestra apresenta os fundamentos do CSS, explicando o que é, por que é importante e como escrever regras CSS simples. O exemplo fornecido é fácil de seguir e o exercício incentiva os alunos a praticar e explorar por conta própria.

siga-me no LinkedIn

Ridoy Hasan