Programação p/ INTERNET - HTML Prof. João Ricardo Andrêo 30/5/ :10 1 Listas Numeradas As listas numeradas funcionam da mesma forma que as listas de marcadores, porém, os marcadores usados anteriormente dão lugar a números. Os elementos utilizados para defini-las são mostrados abaixo – simplesmente o elemento é substituído por. primeiro item da lista segundo item da lista terceiro item da lista As linhas acima causam o seguinte efeito: 1. primeiro item da lista 2. segundo item da lista 3. terceiro item da lista

Programação p/ INTERNET - HTML Prof. João Ricardo Andrêo 30/5/ :10 2 Estas listas podem ser usadas para compor índices. No entanto, não apresentam numeração composta, como no Microsoft Word (isto é 1.1, 1.2, 2.1, 2.2 etc). Para obter este efeito pode ser usado o atributo TYPE e START (HTML 3.2), conforme exemplificado abaixo: Introdução O que é HTML Documento Básico Trabalhando com listas Listas de marcadores Listas numeradas Formatando documentos Fontes Cores

Programação p/ INTERNET - HTML Prof. João Ricardo Andrêo 30/5/ :10 3 Digite os comandos abaixo no Bloco de Notas. Grave com o nome exerc9.htm Listas Numeradas Trabalhando com listas numeradas Introdução O que é HTML Documento Básico Trabalhando com listas Listas de marcadores Listas numeradas Formatando documentos Fontes Cores

Programação p/ INTERNET - HTML Prof. João Ricardo Andrêo 30/5/ :10 4

Programação p/ INTERNET - HTML Prof. João Ricardo Andrêo 30/5/ :10 5 Formatação de textos e caracteres Para que o texto de uma home-page tenha exatamente o efeito que desejamos, é necessário que incluamos nele elementos do HTML que indique tais efeitos. Há dois tipos de formatação em HTML: lógico e físico. Quando formatamos um trecho de texto como cabeçalho de nível 1, por exemplo, não explicitamos se esse tipo de cabeçalho deve ser em alguma fonte determinada, em um tamanho determinado, justificado à esquerda ou à direita, ou centralizado. Esses detalhes de apresentação são deixados para o browser - o dispositivo de apresentação do documento – que pode ser configurado de acordo com o usuário final. A formatação lógica segue o significado lógico do texto marcado: um endereço de , uma citação etc. Sua apresentação final varia conforme o browser, podendo oferecer resultados mais ricos. A formatação física especifica explicitamente o estilo que se quer para o texto: itálico, grifado etc. Sua apresentação final não sofre grandes variações.

Programação p/ INTERNET - HTML Prof. João Ricardo Andrêo 30/5/ :10 6 BLOCOS DE TEXTO O padrão HTML oferece as seguintes formatações de blocos de texto:, e, que veremos a seguir. O elemento Apresenta o texto na mesma maneira em que foi digitado, mantendo quebras de linha e tabulações: teste do elemento pré É muito interessante porque mantém o texto semelhante ao digitado. Pode ser útil para digitar P O E S I A S Uma vez que mantém o texto original, não se deve forçar espaços com essa marcação dentro de outra marcação que já apresente tabulações e espaços específicos. Até o momento, somente como uso de é possível gerar parágrafos com texto justificado à esquerda e à direita.

Programação p/ INTERNET - HTML Prof. João Ricardo Andrêo 30/5/ :10 7 BLOCOS DE TEXTO O elemento É usado para citações longas, conforme mostrado no exemplo. O diagnóstico auxiliado por computador como aquele no qual o radiologista usa os resultados de uma análise computadorizada de imagens médicas como uma “segunda opinião” na detecção de lesões e na elaboração do diagnóstico. (Maryellen Giger, 2000) O elemento É usado para formatar endereços de e referências a autores de documentos: Para entrar em contato com o professor:

Programação p/ INTERNET - HTML Prof. João Ricardo Andrêo 30/5/ :10 8 Vamos verificar o efeito da formação de blocos de texto, através da digitação da home-page abaixo. Grave com o nome exerc10.htm Formatação de blocos de texto Elemento pré teste do elemento pré É muito interessante porque mantém o texto semelhante ao digitado. Pode ser útil para digitar P O E S I A S Elemento blockquote O diagnóstico auxiliado por computador como aquele no qual o radiologista usa os resultados de uma análise computadorizada de imagens médicas como uma “segunda opinião” na detecção de lesões e na elaboração do diagnóstico. (Maryellen Giger, 2000) Elemento adress Para entrar em contato com o professor:

Programação p/ INTERNET - HTML Prof. João Ricardo Andrêo 30/5/ :10 9

Programação p/ INTERNET - HTML Prof. João Ricardo Andrêo 30/5/ :10 10 Lista de Exercícios(T1): 1. Construa uma página em HTML utilizando uma lista numerada das suas atividades diárias. 2. Construa uma página em HTML que apresenta uma poesia, utilizando os elementos de cabeçalho (H1... H6). Depois de 30 segundos esta página deve chamar outra que apresenta o nome do autor. Após 5 segundos retorna a página da poesia 3. Construa uma página com uma imagem de fundo que representa a atividade de você mais gosta, por exemplo: andar de bicicleta. Nesta página coloque um texto de letras vermelhas que relato um fato ou uma história desta sua atividade. Fizeram prova: ????

Programação p/ INTERNET - HTML Prof. João Ricardo Andrêo 30/5/ :10 11 Lista de Exercícios(T2): 1. Construa uma página em HTML utilizando o elemento/tag de cabeçalho (H1...H6) e os separadores horizontais (HR), dividindo a tela em duas porções. A primeira (superior) deve apresentar sua descrição (nome e aparência pessoal), a segunda seus dados de parentesco (nome do pai, mãe, avôs, avós, tios, tias, primos etc). (Salvar como exercicio1.html) 2. Construa uma página em HTML que tenha cor de fundo cinza e texto em verde. Deve apresentar uma lista não numerada com o nome das disciplina do curso de técnico em informática para internet e os respectivos professores. (Salvar como exercicio2.html) 3. Construa uma página com uma imagem de fundo que representa a atividade de você mais gosta, por exemplo: andar de bicicleta. Nesta página coloque um texto de letras vermelhas que relato um fato ou uma história desta sua atividade (Salvar como pagina1.html). Após 5 segundo esta página deve chamar uma segunda página que apresentará seu nome e endereço de (Salvar como pagina2.html). Depois de 10 segundos deve retornar a página principal. Fizeram prova:21,27,28,31,32,35,37