aula 4 - visÃo geral css

3

Click here to load reader

Upload: diogolevel3

Post on 29-Jun-2015

62 views

Category:

Documents


0 download

DESCRIPTION

Aula 4 - VISÃO GERAL CSS

TRANSCRIPT

Page 1: Aula 4 - VISÃO GERAL CSS

O que é CSS

O Cascading Style Sheets (CSS) é uma "folha de estilo" composta por “camadas” e utilizada para definir

a apresentação (aparência) em páginas da internet que adotam para o seu desenvolvimento linguagens

de marcação (como XML, HTML e XHTML). O CSS define como serão exibidos os elementos contidos

no código de uma página da internet e sua maior vantagem é efetuar a separação entre o formato e o

conteúdo de um documento.

Fonte: TECMUNDO

LINK: http://www.tecmundo.com.br/programacao/2705-o-que-e-css-.htm

Formas de utilização (Externo, embutido, inline)

Externo - Existem 3 maneiras de colocarmos configurações de cores, fontes, tamanhos e outros em CSS

para usarmos uma delas e a referencia do CSS como arquivo externo.

<link rel="stylesheet" type="text/css" href="arquivo.css" />

Embutido – Comando CSS fica dentro da página HTML. Permite que a página fique dentro de outra

página.

<style type="text/css"> a { background: #ff9; color: #00f; text-decoration: underline; } </style>

Inline – Possibilita que só aquele elemento seja estabilizado.

<p style="border-style: groove; color: red;"> Copyright 2007 </p>

Page 2: Aula 4 - VISÃO GERAL CSS

Tipos de Seletores (elemento HTML,Id ou Classe)

Elemento HTML - Seletor universal ou seja qualquer elemento.

*{

color: #000000;

}

Aplicável a todos os elementos

ID - Seleciona o elemento <e> identificado com id.

h1#chapter1 {

text-align: center;

}

<e id="Id"... />

Classe – Seletor de classe: seleciona os alementos <e> em que se aplicou a “classe”.

h1.pastoral {

color: green;

}

<e class="classe"... />

Sintaxe

@import "folha.css" tipo-midia;

/* Comentários */

@media tipo-midia {

seletor {

Propriedade: valor(es);

}

};

Page 3: Aula 4 - VISÃO GERAL CSS

Unidades

Relativas

Px – Tamanho de pixels (relativo ao dispositivo)

Em – Tamanho relativo à fonte utilizada no elemento ao qual está inserido

Ex – Corresponde à altura da fonte ‘x’

Absolutas

In – Polegadas (1 polegada=2,54 cm)

Cm – Centímetros

Mm – Milímetros

Pt – pontos (1pt=1/72 polegadas)

Pc – Picas (1 pica=12 pontos)

Porcentagem

% - Porcentagem

0 – Valor ‘0’ não requer atribuição de unidade