Você está na página 1de 8

Introduo CSS

Style Sheet
Professor: Jolvani
Aula 01

Style Sheet CSS

Este mais um curso, aulas para Vc. Estas so


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 prtica


www.w3c.org

CSS uma abreviao do termo ingls


Cascading style sheet Folha de estilos em
cascata.

Folha de estilos em cascata um mecanismo


simples pra adicionar estilos (fontes, cores,
espaamentos) aos documentos Web.

Style Sheet CSS

Ento CSS mais uma tecnologia que vimos


aqui que so normatizadas pelo consrcio W3C

Logo no incio vemos o html e CSS como a


base e a estrutura das aplicaes 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...

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 no
suportado por todos os browsers...

Nas aulas xhtml descobrimos que ele deve ser


usado somente para estruturar o nosso contedo,
somente para fazer as marcaes semnticas...

E o visual, o estilo de nossa pgina, fica por conta


do css, essa a grande casada do mundo web

Ento quando a gente v um portal como a


w3schools por exemplo ou W3C, esse design, esse
layout, essas cores so definidas por uma folha de
estilos que centraliza toda a construo desse
layout.

Style Sheet CSS

Cada browser pode exibir ou no o css... Vamos


fazer um teste e visualizar somente o html...

Dessa forma que foi construdo o html dessa


pgina veja que no nada amigvel (bonito)...

Possibilidades que envolvem o css2, como o css3


no suportado em todos os browser usar o css2
possibilita que todas as pginas criadas rodam em
todos os browsers...

A pgina css zen Garden onde designers do


mundo inteiro criam css e aplicam a essa pagina.

Vamos a pgina www.csszengarden.com

Style Sheet CSS

Nela podemos definir outro estilo selecionando ao lado


direito, altere e observe a diferena...

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


possumos em alterar layout, estilo visual sem mexer
nada no cdigo html...

Style Sheet CSS

Existem muitas paginas que falam sobre css como


cssmaina, apresentando vrios projetos para a
construo de portais com recursos css

Tambm o portal tableless encontramos sobre html e css

Lembrando o html usado para estruturar suas paginas


e o css usado para apresentar visualmente aquela
pgina, ento at a prxima aula....

Prxima Aula: Sintaxe CSS