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

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

HTML - HiperText Markup Language Tecnologia para Web Prof.º Enrique Pimentel Leite de Oliveira

Apresentações semelhantes


Apresentação em tema: "HTML - HiperText Markup Language Tecnologia para Web Prof.º Enrique Pimentel Leite de Oliveira"— Transcrição da apresentação:

1

2 HTML - HiperText Markup Language Tecnologia para Web Prof.º Enrique Pimentel Leite de Oliveira

3 HTML É uma linguagem de marcação que utilizamos para criar páginas Web; O código-fonte é interpretado pelo browser (Internet Explorer, Netscape, etc.);

4 HTML Existem diversos programas de editoração HTML, que tornaria nosso trabalho muito mais simples, porém poderíamos nos tornar usuários desta ferramenta sem entender o que realmente estamos fazendo; Qual quer editor de textos como o bloco de notas no Windows ou o emacs no Linux, pode ser utilizado para criação de documentos html.

5 TAG (ou rótulos) São elementos HTML. Quando válidos são interpretados pelo navegador (browser); São identificadas por serem envolvidas pelos sinais ou ; O formato genérico de uma tag é: Texto

6 Estrutura Básica Título da página Aqui você coloca os elementos HTML, seus textos e imagens. Importante, as tags HTML não são case sensitive.

7 Comentários Não são interpretados pelo browser; Sintaxe: Tudo que for escrito nesta tag não aparecerá em sua página.

8 Cor de fundo Para se colocar cor de fundo em uma página é preciso utilizar o argumento BGCOLOR juntamente com a tag BODY; Sintaxe: Elementos –Importante: A cor pode ser um número em RGB (#FF0000) ou um nome em Inglês (Red).

9 Cabeçalhos (Headings) Utilizado para inserir títulos, ou seja, identificar tópicos ou seções. A letra é diferenciada do restante do texto; Sintaxe: Texto do Cabeçalho –onde n pode variar de 1 a 6, sendo o maior cabeçalho H1 e o menor H6.

10 Parágrafos Uma página não reconhece o fim de um parágrafo pressionando Enter. Para criar parágrafos, deve-se utilizar uma tag. Sintaxe: Texto

11 Quebra de Linha A tag insere uma linha em branco imediatamente após sua especificação, em muitas situações precisaremos apenas quebrar a linha, continuando na linha seguinte. Sintaxe: Texto

12 Estilo de Texto Negrito Texto Itálico Texto Sublinhado Texto Sobrescrito Texto Subscrito Texto Espaçamento Regular Texto

13 Formatando Textos A tag FONT é utilizada com argumentos como: –FACE, definirá que tipo de fonte seu texto irá utilizar. O padrão é Times New Roman; –COLOR, cor da fonte escolhida que seguirá o padrão de cores RGB ou nome da cor em inglês; –SIZE, definirá qual o tamanho da fonte a ser utilizada, lembrando que deveremos seguir o padrão de hipertexto e usar fontes de tamanho 1 a 7. O padrão é 3.

14 Formatando Textos Sintaxe: Texto formatado Exemplo: Texto formatado

15 Listas Lista não-ordenada. Sintaxe: Texto do item Lista ordenada. Sintaxe: Texto do item

16 Alinhamento centralizado Centraliza um texto, uma imagem ou um elemento da página; Sintaxe: Essa frase está centralizada na página

17 Linha Horizontal São utilizadas para dar destaque a títulos ou para gerar a sensação de quebra entre um item de informação e outro; ou WIDTH é a porcentagem da largura da janela do browser; SIZE número de pixels da espessura.

18 Âncoras É um ponto de referência da página que será acessado por um link; Sintaxe para criar uma âncora: Texto para linkar Sintaxe para criar um link para a âncora: Texto usado como link

19 Links Fazer uma ligação entre um texto e uma página; Sintaxe: Texto na página com link Exemplo: AES

20 Imagens Sintaxe para inserir uma imagem na posição atual: Textos em relação à imagem:

21 Imagens clicáveis Sintaxe:

22 Imagens como plano de fundo Para se colocar uma imagem como plano de fundo é preciso utilizar o argumento BACKGROUND juntamente com a tag BODY; Sintaxe: Elementos

23 Tabelas Para inserir uma tabela: Elementos Para inserir uma linha: Elementos Para inserir uma célula (ou coluna): Texto da célula

24 Tabelas Exemplo: Linha1Coluna1 Linha1Coluna2 Linha2Coluna1 Linha2Coluna2

25 Formulários HTML Elemento form –Atributo method Especifica como os dados do formulário são enviados para o Web server method = post –Adiciona os dados do formulário na requisição do navegador method = get –Adicona os dados do formulário diretamente no final da URL –Atributo action Especifica a URL que receberá a requisição –input Especifica os dados que serão fornecidos a URL contida no atributo action

26 Formulários HTML Elemento textarea –Atributo rows Define o número de linhas –Atributo cols Define o número de colunas –Input password Insere uma caixa de texto para receber senhas Elemento checkbox –Permite que usuários escolham um conjunto de opções Elemento select –Insere um drop-down list

27 Formulários HTML Elemento select –Insere um drop-down list Elemento option –Adiciona itens ao the drop-down list –Atributo selected Especifica qual será o item será exibido como selecionado

28 Elementos meta Especifica informações sobre um documento –Atributo name Identifica o tipo de elemento meta keywords ( name = keywords ) –Fornece uma lista de palavras que descrevem a página (utilizadas por sistemas de busca) description ( name = description ) –Fornece a descrição de uma site –Atributo content Fornece informações para um sistema de busca catalogar as páginas –

29 Bibliografia RAMALHO, José Antônio Alves. Iniciando em HTML. São Paulo: Makron Books, W3C - HTML 4.01 Specification: /cover.html#minitoc

30


Carregar ppt "HTML - HiperText Markup Language Tecnologia para Web Prof.º Enrique Pimentel Leite de Oliveira"

Apresentações semelhantes


Anúncios Google