Este documento fornece uma introdução ao CSS (Cascading Style Sheets ou Folhas de Estilo em Cascata), explicando que ele é usado para adicionar estilos como fontes, cores e espaçamentos aos documentos da Web. O CSS é normalizado pelo W3C e trabalha em conjunto com HTML para estruturar e estilizar páginas da Web. A página CSS Zen Garden demonstra como o mesmo código HTML pode ter designs completamente diferentes aplicando diferentes folhas de estilo CSS.

1. Introdução CSS
Style Sheet
Professor: Jolvani
Aula 01

2. Style Sheet CSS
 Este é mais um curso, aulas para Vc. Estas são
as aulas de CSS que vai tornar a sua vida, no
mundo Web, muito mais colorido como a
imagem.
 Mas o que é CSS?
 Vamos abrir nosso browser e ver na prática
www.w3c.org
 CSS é uma abreviação do termo inglês
Cascading style sheet – Folha de estilos em
cascata.
 Folha de estilos em cascata é um mecanismo
simples pra adicionar estilos (fontes, cores,
espaçamentos) aos documentos Web.

3. Style Sheet CSS
 Então CSS é mais uma tecnologia que vimos
aqui que são normatizadas pelo consórcio
W3C
 Logo no início vemos o html e CSS como a
base e a estrutura das aplicações Web.
 Os dois aparecem juntos, inclusive aprender
CSS tem como pré-requisito o conhecimento
de html.
 Ou seja, para ser um bom programador de
interface vc precisa conhecer as duas
tecnologias....
 Na w3schools nos encontramos as referencias
e tutorias html, css, css3, outros scripts...

4. Style Sheet CSS
 Por enquanto o CSS é o mais utilizado e suportado
pelos diferentes tipos de browsers, pois o CSS3
apesar de oferecer recursos poderosos não é
suportado por todos os browsers...
 Nas aulas xhtml descobrimos que ele deve ser
usado somente para estruturar o nosso conteúdo,
somente para fazer as marcações semânticas...
 E o visual, o estilo de nossa página, fica por conta
do css, essa é a grande “casada” do mundo web
 Então quando a gente vê um portal como a
w3schools por exemplo ou W3C, esse design, esse
layout, essas cores são definidas por uma folha de
estilos que centraliza toda a construção desse
layout.

5. Style Sheet CSS
 Cada browser pode exibir ou não o css... Vamos
fazer um teste e visualizar somente o html...
 Dessa forma que foi construído o html dessa
página veja que não é nada amigável (bonito)...
 Possibilidades que envolvem o css2, como o css3
não é suportado em todos os browser usar o css2
possibilita que todas as páginas criadas rodam em
todos os browsers...
 A página css zen Garden é onde designers do
mundo inteiro criam css e aplicam a essa pagina.
 Vamos a página www.csszengarden.com

6. Style Sheet CSS
 Nela podemos definir outro estilo selecionando ao lado
direito, altere e observe a diferença...
 Veja toda estrutura diferente, todo layout diferente,
aplicado a mesma pagina, até parece outra pagina...
 Parece que navegamos em portais diferentes...
 Continuem navegando e percebam a flexibilidade que
possuímos em alterar layout, estilo visual sem mexer
nada no código html...

7. Style Sheet CSS
 Existem muitas paginas que falam sobre css como
cssmaina, apresentando vários projetos para a
construção de portais com recursos css
 Também o portal tableless encontramos sobre html e css
 Lembrando o html é usado para estruturar suas paginas
e o css é usado para apresentar visualmente aquela
página, então até a próxima aula....

8. Próxima Aula: Sintaxe CSS