Curso Tecnolgico de Informtica A (Unidade de Ensino/Aprendizagem 4)

Subunidade 2 - Folhas de estilo (Cascade Style Sheets) Tempo n 23 e 34

Professor: Jos Vasconcelos

OBJETIVOS DA AULA
Conhecer as vantagens e formas de utilizao da CSS; Conhecer a sintaxe bsica das instrues de formatao usada nas CSS; Saber utilizar CSS para formatao dum documento de HTML. Realizar corretamente uma ficha de trabalho para consolidao da matria.
Professor: Jos Vasconcelos

CONTEDO PROGRAMTICO
Vantagens no uso de folhas de estilo Definio de estilos Externamente (numa folha de estilos externa) Internamente (numa folha de estilos interna) localmente (inline) Prioridades Sintaxe usada nas folhas de estilo Selectores Propriedades Valores Comentrios
Professor: Jos Vasconcelos

O QUE SO
Uma Folha de Estilo ou "Style Sheet", funciona basicamente como um "template" que controla a formatao dos elementos HTML de uma pgina. Alterando a formatao atribuda a uma tag HTML, atravs da definio de folhas de estilo, que se sobrepe formatao por defeito utilizada pelo browser para essa tag, possvel modificar toda a aparncia de um conjunto de pginas HTML, ou seja, possvel modificar todo um web site recorrendo s Folhas de Estilo.
Professor: Jos Vasconcelos

VANTAGENS
A personalizao rpida de um "Web site" como um todo, pois possvel modificar a aparncia de todo um site sem a necessidade de editar as pginas HTML. Paralelamente, a utilizao de Folhas de Estilo permite, entre outras coisas: Definir margens e especificar tamanhos de letra e cores de fundo para o texto; Definir as margens de um pargrafo; Modificar a aparncia de uma s pgina ou de todo um site sem, para isso, ter de alterar vrios elementos HTML em cada pgina; Utilizar classes para definir variaes de cada um dos estilos de formatao definidos.
Professor: Jos Vasconcelos

HTML vs CSS

No necessrio repetir a informao de formatao em cada uma das linhas Se se pretende alterar a formatao do documento basta alterar a linha em que a formatao definida
Professor: Jos Vasconcelos

Sintaxe das CSS

Os nomes utilizados nas CSS podem ser qualquer cadeia de caracteres de a-z, A-Z ou 0-9, ponto, hfen, etc; No podem comear por um dgito; Os caracteres colocados entre delimitadores /* e */ so ignorados.

Professor: Jos Vasconcelos

Sintaxe das CSS

Professor: Jos Vasconcelos

Tipos de CSS
em linha definida na prpria linha do elemento HTML a formatar; aplica-se o atributo style ao tag que se pretende formatar. interna definida no cabealho do prprio ficheiro, delimitada pelos tags <style> ... </style>. externa definida num ficheiro parte e pode ser responsvel pela formatao de todas as pginas de um site.
Professor: Jos Vasconcelos

Tipos de CSS em linha

Professor: Jos Vasconcelos

Tipos de CSS interna

Professor: Jos Vasconcelos

Tipos de CSS externa

Professor: Jos Vasconcelos

Nomenclatura das CSS

Professor: Jos Vasconcelos

Nomenclatura das CSS

Professor: Jos Vasconcelos