Apostila Básica de Informática Ensino Fundamental Volume 4

Transcrição

1 Apostila Básica de Informática Ensino Fundamental Volume 4 1

2 Introdução:... 3 A Tela do Excel... 3 Criando uma nova pasta de trabalho... 3 Diferença entre Pasta de Trabalho e Planilha Salvando sua pasta de trabalho... 4 Abrindo Pastas de Trabalho Existentes... 4 Renomear Planilhas... 4 Inserindo nova planilha na pasta de Trabalho... 5 Excluir planilhas de uma pasta de trabalho... 5 Inserindo Linhas e Colunas em sua planilha... 5 Usar símbolos especiais nas células... 5 Selecionando Dados da Planilha... 5 Menu de Atalho... 6 Inserindo dados através de Listas... 6 Usando fórmulas para fazer cálculos... 6 Valor Absoluto... 7 Usando o Assistente de Funções... 7 Limpar ou excluir células... 7 Comando Desfazer... 8 Melhorando a aparência da sua planilha... 8 Trabalhando com Gráficos... 9 Tabela Dinâmica Visualizando e Imprimindo sua Planilha Configuração de Página TAGS Estrutura de uma página em HTML Formatação Conteúdo Imagens Tabelas

3 Excel Introdução: O Excel é um software que trabalha com planilhas eletrônicas. Com ele você será capaz de criar tabelas, gráficos, funções e muito mais...podemos utilizar o Excel para criar páginas na Internet, também. Esse curso vai lhe oferecer os principais conceitos para se trabalhar no Excel. A Tela do Excel Assim que se inicia o Excel, será exibida uma planilha com grade de linhas (horizontais) e colunas (verticais), formando as células. Cada célula possui um endereço, que será exibida na caixa de Nome.O endereço da célula é sempre identificado pelo título da coluna seguido do título da linha. Por exemplo: Uma célula que está localizada na coluna A, na linha 2, terá o seu endereço representado da seguinte forma: A2 Esta definição é muito importante, pois todas as fórmulas(cálculos) que faremos no Excel utilizarão os endereços das células. A tela do Excel contém várias barras de Ferramentas, mas as principais são: Barra de Ferramentas Padrão Barra de Ferramentas Formatação As barras de ferramentas Padrão e Formatação são exibidas com botões de fácil acesso e tarefas comuns. Criando uma nova pasta de trabalho Para se criar uma pasta em branco, utilizamos a barra de ferramentas padrão, clicando no botão Novo, ou no meu Arquivo, opção Novo... Para escolhermos a pasta de trabalho, clicamos na guia Geral e duplo clique no ícone Pasta de Trabalho. 3

4 Diferença entre Pasta de Trabalho e Planilha. Pasta de Trabalho = um arquivo inicialmente com 16 planilhas com limite de até 255 planilhas. Planilha = Conjunto de linhas, colunas e células em que você armazena e manipula dados da pasta de trabalho. 256 colunas X linhas Salvando sua pasta de trabalho Para salvar sua pasta de trabalho, clique o menu arquivo e clique sobre a opção Salvar Como..., escolha um local para gravar e então digite o nome do arquivo, para finalizar clique no botão OK. Sempre procure ir salvando seus dados, uma vez fornecido o nome do arquivo, não será mais necessário fornecê-lo, apenas clique no botão Salvar, que o Excel automaticamente atualiza o arquivo. Abrindo Pastas de Trabalho Existentes É só clicar sobre o botão Abrir, escolher o local onde a pasta está armazenada (para isso clique na caixa Examinar), escolher o arquivo e clicar no botão Abrir. Renomear Planilhas Antes de começar a digitar a sua planilha, renomeie a planilha Plan1 para o nome que você desejar. Para isso é só clicar com o botão direito sobre o nome da planilha, escolhera opção renomear e digitar o nome. Não esqueça de pressionar ENTER após a digitação. Agora é só começar a preencher as células. Perceba que quando você digita números ele é alinhado automaticamente à direita da célula e os textos à esquerda. Isso é feito automaticamente pelo Excel e se chama Alinhamento Geral 4

5 Inserindo nova planilha na pasta de Trabalho Muitas vezes é necessário que você insira uma nova planilha, para isso, vá para o menu Inserir, opção Planilha perceba que a planilha será inserida a esquerda da plan que você está trabalhando Excluir planilhas de uma pasta de trabalho Selecione as planilhas que você deseja excluir. Vá para o Menu Editar, clique sobre Excluir Planilha. Atenção este processo de exclusão não tem volta. Inserindo Linhas e Colunas em sua planilha Muitas vezes é necessário inserir linhas ou colunas depois da tabela pronta. Inserir Linhas, posicione o cursor abaixo da linha a ser inserida, clique no Menu Inserir, opção Linha. Inserir Colunas, posicione o cursos a direita da coluna a ser inserida, clique no Menu Inserir, opção Coluna. Se precisar inserir mais de uma linha ou coluna, selecione um número maior de linhas/ colunas antes de usar o menu Inserir. Usar símbolos especiais nas células Para digitar alguns símbolos especiais é necessário que você digite o código ANSI no teclado numérico. Para digitar, mantenha pressionada a tecla ALT e digite o número abaixo: ALT 167 º ALT 166 ª ALT 163 Selecionando Dados da Planilha Com os seus dados digitados você poderá fazer a seleção de uma única célula ou de um intervalo. Para fazer uma seleção Adjacente veja o quadro abaixo: 5

6 Uma célula Clique sobre a célula Um intervalo Clique na célula inicial e arraste com o mouse até o final do intervalo Uma coluna Clique na letra do título da coluna Uma linha Clique no número do título da linha Para fazer uma seleção Não Adjacente execute as mesmas operações acima e segure a tecla CRTL/ Menu de Atalho Este comando muitas vezes é utilizado, por exemplo quando uma célula ou intervalo é selecionado, o menu de atalho exibe comandos que permitem recortar, copiar, excluir, inserir ou formatar dados. Para isso clique no botão direito do mouse para exibir o menu de atalho. Inserindo dados através de Listas No Excel existe uma forma de inserir dados automaticamente é necessário que você digite uma seqüência. Esta seqüência pode ser: números, datas, meses, etc. Existe uma seqüência pré-definida, mas você pode criar uma seqüência personalizada, para isso entre no Menu Ferramentas, escolha Opção, clique em Listas, digite as informações e clique no botão Adicionar. Usando fórmulas para fazer cálculos Para se criar uma fórmula em uma célula é necessário que você saiba os endereços das células e também iniciar a fórmula com o sinal de =. Os operadores a serem usados são: * multiplicação + soma ^ exponenciação / divisão - subtração Por exemplo, se quiser somar o valor da célula = C1+ C2+ C3, ele irá totalizar o valor destas três células. Mas existe a Função AutoSoma, que fará esta totalização automática, para isso basta selecionar as células envolvidas na operação e clicar o botão de Autosoma. 6

7 A soma das células selecionadas aparecem no canto inferior direito da janela, antes mesmo de você clicar o botão do Autosoma. Valor Absoluto Podemos copiar as fórmulas arrastando a alça de preenchimento por entre as colunas ou linhas. Quando estou arrastando nas linhas fica fixo a coluna, e arrastando por entre as colunas fica fixo a linha dentro da fórmula. Para ficar fixo linha e/ ou coluna no movimento do mouse, devemos colocar o $. Por exemplo =A5 * B7 para fixar o A5 use = $A$ 5 * B7 Usando o Assistente de Funções As funções pré-definidas no Excel efetuam cálculos rapidamente, facilitando as digitações de fórmulas. Os valores em que uma função efetua as operações são chamados de argumentos. Os valores retornados pelas funções são chamados de resultados. A seqüência de caracteres usada em uma função é chamada de sintaxe. A sintaxe de uma fórmula começa com um sinal de igual (=) e é seguida por uma combinação de valores e operadores. Para utilizar as funções de Excel, basta clicar no botão do Assistente de Função, na Barra de Ferramentas Padrão e escolher a função mais apropriada. Existe uma grande variedade de funções disponíveis para facilitar a sua tarefa do dia a dia. As funções mais utilizadas podem ser subdivididas em: Funções Matemáticas Funções Estatísticas Funções Data/ Hora Funções Lógicas Funções de Busca Limpar ou excluir células 7

8 Para excluir ou limpar células, vá para o Menu Editar e escolha a opção desejada. Quando você exclui células, elas são removidas da planilha e as células adjacentes movem- se para preencher o espaço. Quando limpa células, você remove o conteúdo, os formatos ou as notas das células, mas deixa as células vazias na planilha. Comando Desfazer Para desfazer uma ação, use ícone desfazer. Melhorando a aparência da sua planilha Alinhando dados digitados Quando você digita textos muitos longos, eles ultrapassam a grade original da planilha e você quer centralizar dentro de várias colunas, por exemplo o título de uma planilha, use para isto o botão de alinhamento Centralizar colunas selecionadas ou então utilize os demais botões para fazer o alinhamento. Para alinhar verticalmente dentro da célula, use o Menu Formatar, opção Células, escolha guia Alinhamento clique Superior, Centralizado ou Inferior. Para distribuir o texto selecionado dentro da altura da célula, clique sobre Justificado Formatando a aparência dos dados Estando pronta a estrutura básica da planilha, precisamos melhorar o visual, destacando os títulos, os totais e colocar bordas nas células ou nas regiões. Para formatar os dados será necessário que você selecione a área a ser formatada. Perceba que existe uma Barra de Ferramentas Formatação, com botões específicos para agilizar o trabalho. Existe ainda o menu de atalho, para isso clique no botão direito do mouse para ver os comandos de formatação disponíveis No Menu Formatar, opção Células existem mais detalhes sobre a formatação das células, cada guia fornece novas opções. As guias são: Número: formatos pré-definidos ou personalizado 8

9 Alinhamento: horizontal/ vertical e orientação do texto. Fonte: estilo, tamanho sublinhado, cor e efeitos. Borda: todos os tipos de borda e os estilos Padrões: aplica novos padrões de preenchimento para célula Proteção: trava as células e oculta as fórmulas Dica : você pode utilizar colunas estreitas para criar um efeito de recuo na célula. Utilize linhas superficiais para obter uma flexibilidade de espaçamento semelhante. Utilizando Autoformatação Com a Autoformatação você conseguirá um excelente resultado para a apresentação da sua planilha. Para aplicar uma autoformatação, selecione qualquer célula na região atual, vá para o Menu Formatar, opção Autoformatação, selecione o estilo desejado na lista. Quando você aplica a autoformatação, serão analisadas as regiões atuais da planilha e será aplicada automaticamente a formatação com base na posição dos cabeçalhos, fórmulas e dados. Reutilizando a formatação personalizada Com a ferramenta Pincel, você consegue copiar a formatação de uma célula para outra. É necessário, primeiro, que você selecione a célula ou intervalo de células com formatos diferentes e depois aplique a ferramenta pincel. Usando as ferramentas de Desenho Com as ferramentas de desenho, você poderá criar efeitos especiais em sua planilha, tais como: linhas com setas, círculos, caixa, caixa de texto que flutuam sobre a planilha. Para formar as ferramentas de desenho disponíveis, clique sobre o botão desenho na Barra de Ferramentas Padrão. Trabalhando com Gráficos Criando um Gráfico Muitas vezes será necessário que você organize os dados de sua planilha em forma de gráfico, para ficar claro e objetivo. Você conseguirá fazer gráficos de barra de coluna, de torta, e até mesmo combinar marcadores diferentes no mesmo gráfico. 9

10 Você poderá criar um gráfico incorporado diretamente à planilha ou quando você precisar apenas do gráfico, crie uma folha de gráfico separada. Nos dois casos, os valores do gráfico são atualizados sempre que os dados da planilha de origem são alterados. Para criar um gráfico, é necessário que você selecione a região da planilha que deseja incluir como dados do seu gráfico. Se você quiser um gráfico em uma folha separada, clique no Menu Inserir, opção Gráfico, em seguida, clique sobre Como Nova Planilha. Para criar um gráfico incorporado à planilha, selecione os dados, clique no botão Auxiliar Gráfico, na barra de Ferramentas Padrão. Arraste para indicar, a região da planilha onde será posicionado o gráfico. Para fazer uma alteração em um gráfico que você criou clique duas vezes sobre o gráfico incorporado; quando ativo, a sua borda fica mais espessa. Neste momento estará ativo também a Barra de Ferramentas do Gráfico No caso de gráfico incorporado à planilha, selecione os dados a serem inseridos, arraste- os para dentro do gráfico. Se estiver trabalhando com uma folha de gráfico, utilize os comandos Copiar e Colar (menu Editar) para adicionar os dados no gráfico. OBS : muitas vezes é necessário, que você utilize o comando no Menu Editar, opção Colar Especial. Tipos de Gráfico Existem no Excel 14 tipos de gráficos diferentes, você poderá experimentar cada um deles, bastando para isso, ativar o gráfico, e clicar no botão tipos de Gráfico Você poderá utilizar a Autoformatação para alterar rapidamente a aparência de um gráfico. Para aplicar uma Autoformatação, ative o gráfico e clique no Menu Formatar opção Autoformatação. Nesta fase escolhe por Coluna e/ ou Linha Nota- se que a simples mudança de linhas por colunas o gráfico ficou totalmente alterado Após o a finalização do Gráfico, podemos alterar na cor, formato, tipo de linhas, títulos, legenda, dados, etc. Podemos alterar também o tipo do gráfico trocando a visualização do mesmo. 10

11 Adicionando um gráfico vinculado a outro aplicativo Quando você adiciona uma gráfico a outro aplicativo, aconselha- se que você vincule o gráfico ao seu texto, ou a sua apresentação. Pois neste caso, todas as vezes que o gráfico for alterado, automaticamente ele será atualizado no documento vinculado. Para isso, ative o gráfico e clique sobre o botão Copiar-(Menu Editar ), vá para o documento Word e clique sobre o local onde deseja inserir o gráfico. Clique sobre Colar Especial (Menu Editar) e selecione Colar Vincular OBS : aconselha- se os arquivos estarem sempre juntos numa pasta de trabalho (diretório) ou no mesmo disquete. Classificando os Dados e Filtros Para fazer uma classificação dos seus dados, você poderá fazê-lo por qualquer coluna, basta para isso, clicar em qualquer lugar da célula e, em seguida, clique no Botão de Ferramentas Classificar em ordem Ascendente Auto Filtro Para visualizar apenas os contatos desejados de uma tabela utilize o AutoFiltro. Para isso digite a sua tabela com todos os títulos das colunas e seus dados. Depois de inserir a lista ative o AutoFiltro, menu Dados, opção Filtro. Será automaticamente colocado em todas as colunas um filtro, para ativar um dos filtros, basta clicar na seta do lado da coluna e ativar a condição desejada. Para voltar a tabela ao normal ( com todos os dados) clique no filtro e coloque a opção de Todos. Quando você utiliza o AutoFiltro, determinados comandos de edição, formatação e impressão funcionam de uma maneira diferente. Tabela Dinâmica Muitas vezes o volume dos seus dados pode ser grande demais e você precisa uma maneira de resumir essas informações, para isso existe no Excel a Tabela Dinâmica. Para criar a tabela Dinâmica é necessário que você ative a célula do início da tabela que você vai gerar, e na barra de menus em Dados, escolha Tabela Dinâmica. A seguir teremos 4 etapas: 11

12 Etapa 1 : Texto explicativo sobre a tabela dinâmica Etapa 2: o programa sugere a área selecionada Etapa 3: Crie uma nova tabela escolhendo os campos que serão consolidados: Coluna= depto e Dados= Salário Etapa 4: Selecione o início da tabela resultado. É aconselhável escolher uma planilha vazia. Quando alterar algum valor na tabela onde se originou a tabela Dinâmica, verifica-se que a tabela dinâmica não altera automaticamente. Devemos então colocar a célula ativa no início da tabela dinâmica e clicar no botão Atualizar dados Visualizando e Imprimindo sua Planilha Quando você precisar imprimir uma planilha, é aconselhável que se utilize o comando Visualizar Impressão, pois ele permite reduzir as ocorrências do procedimento de tentativa/ erro e o desperdício de papel. Estando na janela de visualizar impressão, clique sobre ZOOM para obter um modo de exibição mais ampliado, caso não seja necessário alterações clique sobre o botão Imprimir. Configuração de Página Para ajustar o layout da página, clique sobre o botão Configurar No Configurar Página que também está disponível no menu arquivo, você pode definir novas margens, alinhamentos, editar Cabeçalhos e Rodapés, e definir linhas/ colunas que devem aparecer em todas as páginas. 12

13 HTML HTML - Hypertext Markup Language, em inglês, ou em português que significa Linguagem de Marcação de Hipertexto. É uma linguagem dedicada à construção de páginas Web. Os dois objetivos básicos da HTML são: Formatação do conteúdo de uma página Web Criar ligações entre várias páginas HTML é uma linguagem Visual baseada em códigos especiais denominados tags. Hipertexto é o conceito que possibilita a "navegação" entre segmentos de texto independentemente de sua seqüência linear ou de sua localização. Uma página Web é um documento criado através do código HTML, que pode ser visualizado na rede mundial de computadores. Além de textos, as páginas Web aceitam imagens, animações, sons e vídeos. O código HTML, utilizado na criação da página Web, pode ser escrito em qualquer editor de textos, por mais simples que seja, como o Bloco de Notas do Windows. Visualize abaixo, um exemplo de código-fonte de uma página HTML. Neste curso utilizaremos os termos "Página Web" e "Página HTML" como sinônimos. O navegador é um interpretador, ou seja, ele interpreta a linguagem HTML e exibe no monitor a formatação da página, definida através dos códigos, conhecidos como tags. TAGS As tags são identificadas facilmente por serem envolvidas pelos sinais "< >" (menor e maior) e "< / >" (menor, barra, maior). O formato genérico de uma tag é: <nome da tag>texto</nome da tag>. A barra indica que a tag está sendo fechada. As tags são utilizadas aos pares. Elas "cercam" uma faixa de texto e o altera. Exemplo: <i>texto em itálico</i> faz com que o texto entre as tags apareça assim em um browser: texto em itálico. A tag com a barra " / " indica que ali fecha-se o cerco que envolve um texto. Veremos, no decorrer do curso, algumas tags que não precisam ser fechadas. Nos próximos tópicos você verá como utilizar as principais tags, mas antes conheça a estrutura de uma página HTML. As tags <html> e </html> são a identificação de uma página HTML, ou seja, fazem com que a página não seja considerada um documento de texto comum. 13

14 Você deve utilizar a tag <html> para iniciar a estrutura de uma página HTML e a tag </html> para encerrar esta estrutura. O par de tags <head> e </head> é usado para especificar o cabeçalho da página. O cabeçalho contém informações sobre a página que não aparecem no navegador. Entre as tags <body> e </body> se constrói o corpo da página HTML, ou seja, entre elas são colocados os textos, imagens e links. Estrutura de uma página em HTML. Visualize, logo abaixo, a estrutura básica de uma página HTML. <html> <head> </head> <body> </body> </html> Uma página HTML é composta basicamente por título, texto, imagem e links. Esses elementos são posicionados na página através de comandos específicos da linguagem HTML. Veja como é simples inserir título e texto em uma página HTML. Abra o arquivo "exemplo1.htm" salvo anteriormente e crie uma estrutura básica. <html> <head> </head> <body> </body> </html> Insira um título em sua página digitando entre as tags <head> e </head> o comando: <title>minha Primeira Página</title>. O nome dado ao título será exibido na barra de títulos do navegador. 14

15 Insira um texto em sua página digitando: Minha Primeira Página HTML entre as tags <body> e </body>. Após inserido o título e o texto, a estrutura do arquivo ficará assim: <html> <head><title>minha Primeira Página</title> </head> <body>minha Primeira Página HTML </body> </html> Tenha cuidado ao criar a estrutura da página, pois se uma tag estiver aberta, ou seja, sem um dos caracteres <, > ou /, você não visualizará corretamente a página em um browser Após ter inserido o título e o texto em sua página, você visualizará o resultado em seu navegador. Antes de mais nada, salve o arquivo "exemplo1.htm" clicando no menu ARQUIVO e em SALVAR do Bloco de notas. Formatação Após inserir o texto, aprenda como alinhá-lo em sua página HTML. As tags de alinhamento do texto são: <div> e </div>. O atributo de alinhamento é: align. As opções de alinhamento são: center - texto centralizado right - texto à direita left - texto à esquerda Volte ao Bloco de notas, usando a combinação das teclas Alt+TAB. Com o arquivo "exemplo1.htm" aberto: 1. Posicione o cursor antes da expressão "Minha Primeira Página HTML". 2. Digite o comando para centralizar o texto: <div align="center">minha Primeira Página HTML</div> 15

16 3. Salve a página clicando no menu ARQUIVOS e em SALVAR. 4. Volte ao navegador, clique no botão Atualizar (Explorer) ou Reload (Navigator) para ver o texto centralizado, Note que a tag <div> foi finalizada com a tag </div>. O recurso align=center, não precisa ser repetido no fechamento do comando, pois ele não é uma tag e sim um atributo das tags <div> e </div>. 1. Em seguida, abra o Windows Explorer, clicando no botão INICIAR da Barra de tarefas do Windows. 2. Clique em PROGRAMAS, Windows Explorer. 3. Abra a pasta "curso_html" e clique duas vezes sobre o arquivo "exemplo1.htm", para abri-lo. O seu navegador se abrirá, exibindo o arquivo com o título e o texto inserido.. Uma das diferenças na confecção de páginas HTML e textos tradicionais é que não é possível adicionar parágrafo em HTML apenas pressionando a tecla Enter. É necessário forçar o fim do parágrafo ou a quebra de linha utilizando comandos especiais. Conteúdo. As tags de parágrafos são: <p> e </p>. Com o arquivo "exemplo1.htm" aberto no Bloco de notas: 1. Posicione o cursor após a tag </div>. Você pode iniciar uma nova linha pressionando a tecla Enter. 2. Digite: <p>inserindo um parágrafo HTML</p>. 3. Salve o arquivo, clicando no menu ARQUIVO e em SALVAR. 4. Vá para o navegador e dê um clique no botão Atualizar (Explorer) ou Reload (Navigator), para visualizar o parágrafo inserido em sua página. A tag </p> não precisa do fechamento para funcionar. No entanto, em documentos que usam componentes avançados da linguagem, a correspondente de fechamento é necessária. Por isso é melhor se habituar a colocar o par de tags. Veja como é simples inserir quebras de linhas em seu texto. A tag para quebra de linha é: <br>. Esta tag pode ser inserida em qualquer ponto do corpo de sua página HTML. 1. Volte ao arquivo "exemplo1.htm" no Bloco de notas. 16

17 2. Após a tag </p> digite: quebra de linha. Em seguida, digite a tag <br> e novamente digite: quebra de linha. A estrutura ficará assim: quebra de linha <br> quebra de linha. Obs: A tag <br> não utiliza a tag de fechamento. 3. Salve o arquivo no Bloco de notas e atualize-o no navegador. Note que entre as duas frases, houve uma quebra de linha automática. O cabeçalho é uma tag que define o tamanho de cada linha de um texto da página. O tamanho do cabeçalho pode ser diferenciado. 1. No Bloco de notas, posicione o cursor após o texto "quebra de linha" e pressione a tecla Enter para iniciar uma nova linha. 2. Digite: <h1>cabeçalho<h1>. 3. Pressione a tecla Enter e digite: <h2>cabeçalho</h2>. 4. Pressione a tecla Enter novamente e repita estes passos até checar a <h6>. 5. Salve o arquivo no Bloco de notas e atualize-o no navegador. A tag cabeçalho possui 6 opções de tamanho: de <h1> à <h6>. As listas permitem que você faça algumas listagens na página. As listas podem ser numeradas ou apenas sinalizadas com marcadores a cada parágrafo. Criando. As listas são utilizadas para fazer listagens numeradas ou com tópicos. Imagine que na página da BH Veículos que você está construindo seja necessário colocar o seguinte: Oferecemos veículos para todos os gostos: Novos Usados Passeio Lazer Populares Luxuosos 17

18 E muito mais... Veja alguns de nossos modelos: Astra e Vectra Audi Blazer Você já deve ter percebido que o bloco de notas não tem os ícones de numerador e marcador para você clicar e os mesmos serem automaticamente inseridos. Isso porque para que o browser seja capaz de reconhecer os marcadores não bastaria clicar em um ou dois ícones, mas é necessário colocar o texto desejado entre as tags com os comandos que irão orientar o browser a exibir os marcadores ou os numeradores. As tags que determinam o início e o fim dos marcadores e numeradores são diferentes, variam de acordo com o tipo de lista que você deseja, mas cada linha da lista é iniciada sempre com o comando <LI>, que não é um comando do tipo início fim. Listas Numeradas: <OL> <LI> </OL> 1. <OL> é usa na construção de LISTAS NUMERADAS, requer o comando <LI> para digitar os dados da lista. frente. 2. <LI> usado para a definição de cada linha na lista numerada, digitar o texto logo em 3. </OL> finaliza a lista numerada. Atributos: 18

19 TYPE=valor, lista numerada tipo: 1. Valor = a -> Caracteres de numeração como letras minúsculas. 2. Valor = A -> Caracteres de numeração como letras maiúsculas. 3. Valor = I -> Caracteres de numeração como numerais romanos em maiúsculas. 4. Valor = i -> Caracteres de numeração como numerais romanos em minúsculas. 5. Valor = 1 -> Caracteres de numeração como números padrão. START=valor, em que número ou letra vai se iniciar a enumeração da lista. Ex.: Para iniciar na letra E - valor = 5 Ex.: Para iniciar no numeral IV - valor = 4 Ex.: Para iniciar no número 10 - valor = 10 Estrutura de uma lista com os atributos acima: <OL type=a> <LI> Primeira linha de texto da lista <LI> Segunda linha de texto da lista </OL> Listas não ordenadas (Marcadores) <UL> 19

20 <LI> </UL> 1. <UL> usado na construção de LISTAS NÃO ORDENADAS, requer o uso do comando <LI> para cada linha de dados. 2. <LI> para a definição de cada linha da lista não ordenada, digitar o texto logo em frente. 3. </UL> finaliza a lista não ordenada. Atributos: TYPE=valor, define marcador do tipo: 1. Valor=SQUARE -Define marcador do tipo quadrado sólido (preenchido). 2. Valor=DISC -Define marcador do tipo círculo sólido (preenchido) PADRÃO. 3. Valor=CIRCLE -Define marcador do tipo círculo transparente. Estrutura de uma lista com os atributos acima: <OL type=1> <LI> Abaixo exemplo lista não ordenada <UL type=square> <LI> Dados da lista não ordenada <LI> Linha dois da lista </UL> 20

21 Imagens. Link é um "atalho" que pode levá-lo a outras partes do documento ou a outros documentos. Em páginas HTML, os links são representados por textos sublinhados ou imagens. Quando você aponta o mouse para um link, o cursor se transforma em uma mãozinha apontando. Existem dois tipos de imagens que podem ser inseridas em uma página. Os formatos de imagens reconhecidos pelos navegadores são: formato.jpg e formato.gif. O formato jpg ou jpeg (Joint Photografic Experts Group) é mais utilizado para fotos. O formato gif (Graphics Interchange Format) é mais utilizado para desenhos vetoriais, como os cliparts. Para criar uma imagem com extensão.gif ou.jpg é necessário utilizar um programa de edição gráfica, como por exemplo o Photoshop, Fireworks ou o CorelDRAW. A inclusão de imagens em uma página HTML dá mais qualidade ao trabalho. É fácil incluir uma imagem na página HTML. A sintaxe é:<img src="nome da imagem"> Não é necessário fechar esta tag. A imagem criada deve ser salva na mesma pasta que contém as páginas HTML, caso utilize uma pasta diferente da qual as páginas HTML estão salvas deve se utilizar a sintaxe da seguinte maneira: <img src="pasta/nome da imagem">, esse procedimento deve ser feito para que o navegador possa exibir as imagens. É possível inserir uma imagem de fundo na página HTML, caso não queira utilizar uma única cor. O comando de inserção de imagem "background", é um atributo da tag <body>. Ao digitar a estrutura básica, substitua a tag <body> por este comando: <body background= "nome da imagem.gif ou.jpg">. A imagem precisa estar arquivada na pasta onde se encontra a página HTML correspondente, caso esteja em uma pasta diferente utilize o comando da seguinte maneira <body background= "PASTA/nome da imagem.gif ou.jpg">. Exemplo: <html> <head> <title>titulo do Site</title> </head> <body bgcolor=#ffff00> 21

22 <a href="pasta/pagina.htm">clique aqui</a> <img src=pasta/imagem.jpg> <b>texto em negrito</b> </html> Note que sempre iniciamos um codigo com sinal de menor < e sempre finalizamos com sinal de maior > sobre tudo, em sua maioria os codigos HTML são finalizados com barra antes do ultimo argumento, observe a linha 3 antes do ultimo title, podemos facilmente visualizar a / demonstrando o final do argumento. Tabelas. Tabelas são usadas na maioria das páginas da Web. Elas dão uma aparência mais elegante a página além de permitirem orientar o browser a posicionar textos e imagens lado-alado na página. Uma das utilidades da tabela é quando você precisa colocar uma imagem de uma lado e o texto deve ser escrito do outro lado. Com o que você já conhece do html, já pode perceber que isso não é possível. Uma forma de conseguir posicionar os objetos e textos na página é através do recurso tabela. Você pode inserir o texto e as imagens dentro de células da tabela. Neste caso o usuário não deve visualizar as bordas da tabela, o que você verá que é muito simples de resolver. Outra grande utilidade do recurso tabela é quando você precisa construir realmente uma tabela de dados. Pode ser uma tabela de s, de nomes, de sites e etc. As tags de tabela são do tipo início e fim <TABLE> e </TABLE>. Além dos atributos que você já conhe da linguagem HTML, aqueles que ficam dentro da tag, ainda existem diversos comandos, que inseridos entre as tags de tabela permitem trabalhar bem as linhas e colunas da tabela. Os comandos inseridos entre os comandos de tabela também possuem seus atributos. <TABLE> usado para se definir uma tabela HTML, seus atributos são: 1. BORDER ="valor" define a largura da borda externa da tabela (contorno). Se não incluir a atribuição da borda aparecerá uma tabela sem bordas. 2. CELLSPACING="valor" define o espaçamento horizontal entre uma célula e outra. Refletirá na largura da borda. 3. CELLPADDING="valor" define o espaçamento vertical entre uma célula e outra. Sem refletir na largura da borda. 4. WIDTH="valor %" define a quantos % de largura deverá conter a tabela em relação à largura da tela. 22

23 5. HEIGHT="valor %" define quantos % de altura deverá conter a tabela em relação à altura da tela. 6. BGCOLOR="#cor" define a cor de fundo da tabela. 7. BACKGROUND="imagem" define uma imagem como fundo da tabela. Comandos que serão inseridos entre as tags <TABLE> </TABLE>: 1. <CAPTION> e </CAPTION> definem o Título da Tabela e ALINHA de acordo com o tamanho da tabela. 2. <TR> e </TR> para se definir o início e o fim de cada linha da tabela (table row) Atributos: 1. ALIGN="valor" define alinhamento do texto dentro da tabela. 2. LEFT= alinhamento à esquerda. 3. RIGHT= alinhamento à direita. 4. CENTER= alinhamento ao centro. 5. VALIGN="valor" define o alinhamento vertical dentro da célula. 6. TOP = Alinha no topo da célula. 7. MIDDLE = Alinha no meio das células 8. BOTTON = Alinha na parte inferior da célula. <TH> e </TH> Define o cabeçalho da tabela (table header)iniciar e finalizar cada célula do cabeçalho. Atributos: ALIGN= valor Define alinhamento horizontal dentro da célula. Se o alinhamento já foi definido em TR não é necessário defini-lo aqui. LEFT=alinhamento à esquerda. RIGHT=alinhamento à direita. CENTER=alinhamento ao centro. 23

24 VALIGN=valor Define o alinhamento vertical dentro da célula. Se o alinhamento já foi definido em TR não é necessário defini-lo aqui. TOP = Alinha no topo da célula. MIDDLE = Alinha no meio das células. BOTTON = Alinha na parte inferior da célula. COLSPAN=valor Instrui o visualizador (browser) a unir um número específico de colunas da tabela. (Ocupar lugar de duas células, mesclar). ROWSPAN=valor Instrui o visualizador a unir um número específico de linhas da tabela (Mesclar duas linhas). NOWRAP Instrui o visualizador a não distribuir o texto do cabeçalho dentro da célula da tabela <TD> </TD> Define como ficará o conteúdo de cada célula da Linha (table data) Atributos ALIGN= valor Define o alinhamento horizontal dentro da célula. Se o alinhamento já foi definido em TR não é necessário defini-lo aqui. LEFT=alinhamento à esquerda. RIGHT=alinhamento à direita. CENTER=alinhamento ao centro. VALIGN=valor Define o alinhamento vertical dentro da célula. Se o alinhamento já foi definido em TR não é. Necessário defini-lo aqui. 24

25 TOP = Alinha no topo da célula. MIDDLE = Alinha no meio das células. BOTTON = Alinha na parte inferior da célula. COLSPAN=valor Instrui o visualizador (browser) a unir um número específico de colunas da tabela. (Ocupar lugar de duas células, mesclar). ROWSPAN=valor Instrui o visualizador a unir um número específico de linhas da tabela (Mesclar duas linhas). Bibliografia (Extraído em: 29/11/2006) (Extraído em: 29/11/2006) 25