Análise De Sistemas

INTRODUÇÃO A
PROGRAMAÇÃO WEB

INTRODUÇÃO A PROGRAMAÇÃO WEB

CASCADE STYLE SHEET - CSS
O que é?
CSS é uma linguagem para estilos que define o layout de documentos
HTML. Por exemplo, CSS controla fontes, cores, margens, linhas, alturas, larguras, imagens de fundo, posicionamentos e muito mais

INTRODUÇÃO A PROGRAMAÇÃO WEB

CASCADE STYLE SHEET - CSS
Quais os benefícios?
• controle do layout de vários documentos a partir de uma simples folha de estilos;

• maior precisão no controle do layout;
• aplicação de diferentes layouts para servir diferentes mídias (tela, impressora, etc.);
• emprego de variadas, sofisticadas e avançadas técnicas de desenvolvimento. INTRODUÇÃO A PROGRAMAÇÃO WEB

CASCADE STYLE SHEET - CSS
Como utilizar?

Usando HTML podemos fazer assim:

Com CSS o mesmo resultado será obtido assim:

body {background-color: #FF0000;}

INTRODUÇÃO A PROGRAMAÇÃO WEB

CASCADE STYLE SHEET - CSS
Como utilizar?

seletor {propriedade:valor;}
Em qual tag será aplicada(ex:body, table)

Qual propriedade será alterada(ex:width,bgc olor)

Qual o valor a ser associado à propriedade INTRODUÇÃO A PROGRAMAÇÃO WEB

CASCADE STYLE SHEET - CSS
Como utilizar?

body {background-color:#FF0000;}
Em qual tag será aplicada(ex:body, table)

Qual propriedade será alterada(ex:width,bgc olor)

Qual o valor a ser associado à propriedade INTRODUÇÃO A PROGRAMAÇÃO WEB

CASCADE STYLE SHEET - CSS
Como utilizar?

Método in line:

INTRODUÇÃO A PROGRAMAÇÃO WEB

CASCADE STYLE SHEET - CSS
Como utilizar?
Método interno:

Exemplo

body {background-color: #FF0000;}

Esta é uma página com fundo vermelho

INTRODUÇÃO A PROGRAMAÇÃO WEB

CASCADE STYLE SHEET - CSS
Como utilizar?
Método externo:
Arquivo .html

Riesling
Pinot Blanc

a { color: blue; }
a.classe1 { color: #FFBB00; }
a.classe2 { color: #800000; }

INTRODUÇÃO A PROGRAMAÇÃO WEB

CASCADE STYLE SHEET - CSS
Identificando e