Apostila Internet - 2011 CAPÍTULO 2 9 Marcadores da TAG <HEAD>: <TITLE> - identifica o título da página, o que será exibido na barra de título do navegador ao carregar a página em questão. Além disso, quando o usuário coloca a página nos favoritos, é o título da página que aparecerá na lista. Dica: Se você utilizar pontos no inicio do título, ao adicionar a página nos favoritos, aparecerá em ordem alfabética, logo, ficará nas primeiras posições. Exemplo: <TITLE>..:: Título da página ::..</TITLE> <META> - entre muitas funções, descreve o conteúdo do site para os buscadores, também podemos inserir palavras chaves para facilita a busca da página. Além disso, por meio desta TAG, “assinamos” o site, declarando a autoria sob o código fonte. Exemplos: <META NAME=”description” CONTENT=”Página com conteúdo de internet”> - recurso facilitador para buscas, mostra o resumo do site. <META NAME=”keyworks” CONTENT=”HTML – css – javaScript”> recurso facilitador para buscas, mosta as palavras chaves do site. <META HTTP-EQUIZ=”content-type” CONTENT=”text/html”> - controla a ação dos navegadores, refina as informações fornecidas pelo cabeçalho. <BASE> - especifica o endereço (URL) que aparece na página. Exemplo: <BASE HREF=”www.enderecodosite.com.br”> Com isso ao invés de utilizarmos o link www.enderecodosite.com.br/contato, podemos apenas colocar /contato para acessar esse link. <LINK REL=”valor”> - especifica a relação entre o documento atual e o documento vinculado. Exemplo: Valor alternate stylesheet start next prev contents index glossary copyright chapter section subsection appendix Descrição Uma versão alternativa do documento (página de impressão, ou seja, traduzido ou espelho) Uma folha de estilo para o documento O primeiro documento em uma seleção O proximo documento em uma seleção O documento anterior em uma seleção Uma tabela de conteúdos para o documento Um índice para o documento Um glossário (explicação) das palavras usadas no documento Um documento contendo informações sobre direitos autorais Um capítulo do documento A seção do documento A subseção do documento Um apêndice do documento Professora Thaís Ramos Viegas Apostila Internet - 2011 help bookmark Um documento de ajuda Um documento relacionado 10 Formatações do texto: Através da TAG <FONT> e </FONT> é possível configurar tamanho, cor e estilo da fonte através dos seguintes atributos: FACE – configura a fonte usada. Exemplo: <FONT FACE=”verdana”> texto </FONT> SIZE – configura o tamanho da fonte que varia de -6 à +6. Exemplo: <FONT SIZE=”+2”> texto </FONT> COLOR – configura a cor da fonte, utiliza o mesmo padrão das cores do fundo (BGCOLOR). Exemplo: <FONT COLOR=”blue”> texto </FONT> Podemos utilizar os três atributos juntos: Exemplo: <FONT FACE=”arial” SIZE=”+4” COLOR=”red”> texto </FONT> Tabelas: As tabelas para páginas de internet são normalmente utilizadas para configurar o layout da página, organizando melhor a posição de imagens e textos. Como toda e qualquer tabela, é composta de linhas e colunas, formando células. A tabela é iniciada pela TAG <TABLE> e finalizada por </TABLE>, para criarmos uma linha dentro desta tabela, inserimos a TAG <TR> como toda TAG, finaliza-se por </TR>; para criarmos uma coluna dentro da linha, inserimos a TAG <TD> e finaliza-se por </TD>. Exemplo: <TABLE> <TR> <TD> Nome </TD> <TD> Idade </TD> <TD> Fone </TD> </TR> <TR> <TD> Pafuncio </TD> <TD> 37 anos </TD> <TD> 3366-4774 </TD> </TR> </TABLE> Visualmente ficará: Professora Thaís Ramos Viegas Apostila Internet - 2011 Nome Pafuncio Idade 37 anos Fone 3366-4774 11 Atributos da TAG <TABLE>: BORDER – definimos aqui se haverá borda e sua espessura. Se não quisermos utilizar borda, basta colocar 0 (zero) na BORDER. Exemplo: <TABLE BORDER=”3”> WIDTH E HEIGTH – indica o tamanho da tabela, que pode ser especificada em porcentagem ou em pixel. WIDTH é responsável pela largura e HEIGTH pela altura da tabela. Exemplo: <TABLE WIDTH=”80%” HEIGTH=”40%”> ALIGN – como vimos anteriormente, é o posicionamento da tabela, que podem ser os mesmos do alinhamento do parágrafo. Exemplo: <TABLE ALIGN=”right”> BORDERCOLOR E BGCOLOR – com o comando BORDERCOLOR conseguimos alterar a cor da borda da tabela, enquanto que BGCOLOR é responsável pela cor do fundo da tabela. Exemplo: <TABLE BORDERCOLOR=”white" BGCOLOR=”purple”> BACKGROUND – com este commando podemos colocar uma imagem ao fundo da tabela. Exemplo: <TABLE BACKGROUND=”imagem.jpg”> Juntando essas informações, veja o exemplo abaixo: <TABLE WIDTH="100%" HEIGHT="40%" BORDER="2" BORDERCOLOR="#9966FF" ALIGN="CENTER"> <TR ALIGN="CENTER"> <TD ROWSPAN="3"> ESCOLAS E FACULDADES QI </TD> <TD COLSPAN="3" ALIGN="CENTER"> CADASTRAMENTO </TD> </TR> <TR ALIGN="CENTER"> <TD> NOME </TD> <TD> TELEFONE </TD> <TD> SEXO </TD> </TR> <TR> <TD> MARCOS OLIVEIRA </TD> <TD> 3683-5577 </TD> <TD> MASCULINO </TD> </TR> </TABLE> BGCOLOR="#FFFFFF" Visualmente ficará: Professora Thaís Ramos Viegas Apostila Internet - 2011 12 Figura 5 - Tabela Professora Thaís Ramos Viegas