A apresentação está carregando. Por favor, espere

A apresentação está carregando. Por favor, espere

Ferramentas para Sistema Web Sistemas de Informação Aula 6 – 03/04/2013.

Apresentações semelhantes


Apresentação em tema: "Ferramentas para Sistema Web Sistemas de Informação Aula 6 – 03/04/2013."— Transcrição da apresentação:

1 Ferramentas para Sistema Web Sistemas de Informação Aula 6 – 03/04/2013

2 Revisão Imagens Atributos requeridos: src alt src Caminhos absolutos Caminhos relativos Imagens como links 2

3 CSS Sigla para Cascading Style Sheets Em português foi traduzido para folhas de estilo em cascata Finalidade de retirar da marcação toda e qualquer declaração que vise a apresentação. Formata a informação Guarde: HTML para estruturação e CSS para apresentação 3

4 CSS Podemos aplicar o CSS de três formas em um documento HTML: Definindo as propriedades CSS diretamente no elemento HTML através do seu atributo style. Definindo as regras CSS dentro de um elemento com a tag style. Definindo as regras CSS em arquivo à parte do documento HTML. 4

5 Regras e Propriedades Propriedade CSS é uma característica visual de um elemento HTML. A regra é um conjunto de propriedades definidas para um elemento ou para um grupo de elementos HTML. 5

6 CSS Inline 6 Abordagem CSS Inline não é recomendada!

7 Tag A tag é usada para definir informações de estilo para um documento HTML. Dentro do elemento você pode especificar como elementos HTML devem ser renderizados no navegador. Atributo type => Especifica o tipo MIME do documento linkado. 7

8 Exemplo tag 8

9 Tag A tag define a relação entre um documento e um recurso externo. É o mais utilizado para vincular documentos HTML a folhas de estilo. Atributo rel => Especifica a relação entre o documento HTML e o documento linkado. Atributo type => Especifica o tipo MIME do documento linkado. Atributo href => Especifica o local do documento linkado. 9

10 Tag 10

11 Arquivo CSS 11 Arquivo estilo.css

12 Mais Informações 12

13 Exercícios 1.Dentro da pasta com o seu nome utilizada no capítulo anterior, crie uma subpasta chamada css. Novamente para facilitar, utilize apenas letras minúsculas em todas as pastas e arquivos que criarmos durante esse capítulo. 2.Crie um documento HTML em um arquivo chamado testando-css.html dentro da pasta css. Todos os parágrafos desse documento devem ser exibidos em negrito, com cor azul e com fonte 20px. Defina uma regra CSS para formatar os parágrafos usando a tag. Use os valores abaixo: font-weight:bold; font-size:20px; color:#0000FF; 13

14 Solução 2 14

15 Exercícios 3.Para organizar melhor o conteúdo e a formatação da página criada no exercício anterior, crie um arquivo CSS chamado regras-de-formatacao.css na pasta css. 4.Modifique o arquivo testando-css.html para aplicar as regras de formatação criadas no exercício anterior. Use a tag. 15

16 Solução 3 16

17 Solução 4 17

18 Fim 18


Carregar ppt "Ferramentas para Sistema Web Sistemas de Informação Aula 6 – 03/04/2013."

Apresentações semelhantes


Anúncios Google