Introducing
Your new presentation assistant.
Refine, enhance, and tailor your content, source relevant images, and edit visuals quicker than ever before.
Trending searches
1SEM 2BIM - css folha de estilos
9
// Cascading Style Sheets
PLACE
YOUR
LOGO
HERE
Professor Alan Reis
Internet e Programação Web
O que é o CSS?
Who we are
É Folha de Estilos de um site.
O CSS é chamado de linguagem Cascading Style Sheet e é usado para estilizar elementos escritos em uma linguagem de marcação como HTML.
O que fazer?
Com ele é possível definir, para uma página HTML sem estilos, cores de para textos,
fundos, bordas, tamanhos e tipos de fontes, espaçamentos, posicionar blocos, fazer
animações, entre outros.
Exemplos
exemplo
Porque usar CSS ?
Porque usar css?
Entre os principais benefícios estão:
- O controle e facilidade de manutenção visual do site através de um arquivo externo;
- Aumento da performance e velocidade das páginas;
- Possibilidade de elaborar layouts para atender diferentes tipos de dispositivos
Sintaxe
CSS
A sintaxe CSS é formada por uma regra com 3 itens fundamentais para definir um
estilo. São eles:
- Seletor;
- Propriedade;
- Valor.
Seletor {propriedade: valor}
seletor
Seletor
O seletor vincula um elemento do documento HTML a declaração CSS. Declaração
CSS é formada pela propriedade e o valor
Propriedade
propriedade
A propriedade define uma característica visual para o elemento HTML “selecionado”
pelo seletor.
Exemplo: O texto de um parágrafo, marcado com elemento HTML “p”, possui uma
propriedade de cor denominada “color”.
Valor
Já o valor atribui valor a propriedade escolhida para o elemento selecionado.
Exemplo: O valor da propriedade color para o elemento HTML “p” selecionado é “red”
(vermelho). Ou seja, o texto do parágrafo terá uma cor vermelha.
Tipos de Seletores
Seletores
Os tipos de seletores mais usados que já te possibilitará estilizar
páginas.
Seletor de tipo de elemento
Elementos
O seletor “p” que usamos nos exemplos anteriores é um seletor de tipo de elemento.
Esta espécie de seletor identifica e vincula um elemento HTML, basta que para isso
coloque o elemento como seletor.
Who we are
Mission Statement
Our Locations
Organization
Seletor do tipo ID
Seletor ID
É um seletor individual usado para vincular somente um elemento por página web. Ele
não pode ser usado em dois ou mais elementos. Para construí-lo basta que você crie
um nome precedido pelo símbolo #.