Trabalho De Css

22/04/2013

1

Programação e Design para Web

5 º Semestre

Faculdade de Negócios e

Tecnologia da Informação

CSS

Professor:

Hirlei Carlos

Bacharelado em Sistemas de Informação

1º Semestre 2013

Aula 05

Introdução

Definição

S

``````

Sintaxe

Estrutura do código

Seletores

Classe

Id

Unidades de Medidas

Vinculando folhas de estilos

Ferramentas para SistemaWEB

Cores e Fundo

Fontes

Textos

Links

22/04/2013

2

Cascading Style Sheets (ou simplesmente CSS) é uma linguagem de

til tili d d fi i t ã d d t it

``````

estilo utilizada para definir a apresentação de documentos escritos em uma

linguagem de marcação, como XHTML ou HTML.

Lista de estilo em cascata

Lista de estilos?

Simplificando

Ferramentas para SistemaWEB

Simplificando...

Conjunto de regras que definem como os elementos da página devem ser

exibidos.

A finalidade do CSS é retirar do (X) HTML toda e qualquer declaração que

i à f t ã/ t ã d d t

``````

vise formatação/apresentação do documento.

Ferramentas para SistemaWEB 4/65

22/04/2013

3

``````

(X) HTML:

• Conteúdo;

• Dados e estrutura;

CSS:

• Apresentação;

• Formatação layout cores fontes

Ferramentas para SistemaWEB 5/65

Formatação, layout, cores, fontes,

posicionamento.

index.html produtos.html `````` cadastro.html contato.html

Ferramentas para SistemaWEB 6/65

22/04/2013

4

Controle total sobre a apresentação do site a partir de um arquivo

central;

``````

Agilidade na manutenção e redesign do site;

Saída para diferentes tipos de mídia a partir de uma versão única de

(X)HTML;

Redução de tempo de carga dos documentos web;

Adequação simplificada aos critérios de acessibilidade e usabilidade;

Fácil manutenção de grandes sites (projetos);

Ferramentas para SistemaWEB 7/65

Aumento considerável na portabilidade dos documentos Web.

Hoje os Designers e Desenvolvedores ainda

tem que se virar pra conseguir certos efeitos gráficos como sombras em

``````

objetos e textos, cantos arredondados, fazer

múltiplas camadas de planos de fundo, inserir opacidade nos elementos,

trabalhar com diferentes famílias tipográficas,

trabalhar com colunas de textos...

Ferramentas para SistemaWEB 8/65

22/04/2013

5

Com o CSS3 temos maior controle sobre o estilo dos elementos da

``````

página, sem ter que recorrer a Hacks ou truques para isso.

Propriedades para cantos arredondados, ou sombras em textos estaão

disponíveis na nova versão da linguagem, sem precisarmos recorrer ao

uso de imagens.

Ferramentas para SistemaWEB 9/65

Informações - http://www.css3.info

SELETOR : É o alvo da regra CSS. Genericamente, é a tag do

l d d d d d f

``````

elemento da marcação ou uma entidade capaz de definir com precisão

em qual lugar da marcação será aplicada a regra CSS.

DECLARAÇÃO: Determina os parâmetros de estilização.

Compreende a propriedade e o valor.

• Propriedade: Define qual será a característica do elemento,

Ferramentas para SistemaWEB 10/65

p q ,

alvo do seletor a ser estilizada.

• Valor: É a quantificação ou a qualificação da propriedade.

22/04/2013

6

O