 |
 |
| ANTERIOR |
| Tutorial Html Básico |
Comandos de Texto Todos os comandos são chamados de tags. Cada uma delas manda o browser (ou visualizador) alterar o texto de uma maneira diferente. A sintaxe de uma tag é a seguinte: <tag>texto</tag> Onde <tag> inicia a tag, </tag> fecha a tag e texto é o que será exibido pelo browser. Exemplo: <B> Teste </B> seria exibido como Teste - Tags de "Estilo": <B> NEGRITO <I> ITÁLICO <U> SUBLINHADO *Lembre-se que, ao terminar o trecho correspondente à tag, deve-se colocar a tag de fechamento, que é correspondente ao nome da tag, com uma "/". Ex: para se fechar tags de itálico <I>, usa-se o </I>. - Tags de Tamanho: <H1> TAMANHO MÁXIMO <H2> TAMANHO GRANDE <H3> TAMANHO MÉDIO <H4> TAMANHO "QUASE NORMAL" <H5> TAMANHO PEQUENO <H6> TAMANHO MÍNIMO - Quebra de Linha e Parágrafo Para mudarmos de linha, usamos a tag <BR> (que não necessita de tag de fechamento). Para termos parágrafo, usamos a tag <P> (que também não necessita de fechamento). - Exemplos Gerais: O texto: -------------------------------------------------------------------------------- <H2> Título Grande</H2><P> <B>Usando negrito.</B> <I><U>Usando o itálico e o sublinhado juntos.</I></U><BR> <I>É possível sobrepor uma ou mais tags.</I><P><H6> O texto pode até ficar <I><B><U> negrito, itálico e sublinhado.</I></B></U></H6> -------------------------------------------------------------------------------- Visto pelo browser: -------------------------------------------------------------------------------- Título Grande Usando negrito.Usando o itálico e o sublinhado juntos. É possível sobrepor uma ou mais tags. O texto pode até ficar negrito, itálico e sublinhado. -------------------------------------------------------------------------------- Como falado no exemplo, podemos sobrepor as tags, fazendo com que um texto fique no tamanho mínimo e, ao mesmo tempo, seja visto em negrito, itálico e sublinhado. - Outras Tags: Existem outras tags relacionadas a texto: <HR> Mostra uma linha horizontal <UL> Inicia uma lista <OL> Inicia uma lista numerada <LI> Acrescenta um ítem de uma lista - Exemplos: O texto: -------------------------------------------------------------------------------- <HR> <UL> <LI> ESTA É UMA LISTA <LI> ESTA É UMA LISTA <LI> ESTA É UMA LISTA </UL> <OL> <LI> ESTA É UMA LISTA NUMERADA <LI> ESTA É UMA LISTA NUMERADA <LI> ESTA É UMA LISTA NUMERADA </OL> -------------------------------------------------------------------------------- Seria exibido como: -------------------------------------------------------------------------------- -------------------------------------------------------------------------------- ESTA É UMA LISTA ESTA É UMA LISTA ESTA É UMA LISTA ESTA É UMA LISTA NUMERADA ESTA É UMA LISTA NUMERADA ESTA É UMA LISTA NUMERADA -------------------------------------------------------------------------------- Como podemos perceber, não há necessidade de se colocar tags de quebra de linha <BR> ou de parágrafo <P> entre os ítens de uma lista. Vale a pena ressaltar que, para podermos fechar a lista, devemos acrescentar a tag de fechamento (</UL> ou </OL>). -------------------------------------------------------------------------------- . Links Existem dois tipos de links: os externos - que ligam a uma outra página; os internos - que ligam a um determinado ponto dentro da mesma página. - Links Externos A tag de links externos é a seguinte: <A HREF="XXXXXX"> Texto </A> Onde: XXXXX corresponde ao endereço da página e Texto corresponde ao texto exibido pelo link. Exemplos: <A HREF="http://www.oocities.org/Heartland/1296">Revista Aqua </A> <A HREF="mailto:theo.araujo@sti.com.br">Mande e-mail!</A> é igual a: *Nota: o mailto:xxxx diz ao browser para enviar mensagem ao e-mail definido pelo xxxx. Ao digitar o endereço da página, assegure-se de estar digitando-o corretamente, com as letras maiúsculas e minúsculas EXATAMENTE como são.http://www.Teste.com/ não é equivalente à http://www.teste.com/. - Links Internos Links internos, quando ativados, levam o leitor a outro local do documento. Para tanto, temos que definir o alvo (local para onde o leitor será levado) e o link. Para definirmos o alvo, usamos a seguinte tag: <A NAME="XXXX">Texto</A> Onde: XXXX é o nome do alvo e Texto é o que aparecerá no local do alvo. (O texto é opcional). Para definirmos o link, usamos a tag: <A HREF="#XXXX">Texto</A> Onde: XXXX é o nome do alvo (que deve ser precedido por #) e Texto é o que estará escrito no link. Exemplos: <A NAME="TEST">Teste</A> <A HREF="#test">Volta ao ítem Teste</a> -------------------------------------------------------------------------------- . Figuras A colocação de figuras é extremamente fácil. Basta colocar a seguinte tag: <IMG ALT="XXXXX" SRC="ZZZZZZ.YYY"> Onde: XXXXX - Texto alternativo à figura (no caso da figura não aparecer); ZZZZZZ - Nome da figura (pode ser junto com o endereço, se não for no mesmo diretório da página) e YYY - extensão da figura (JPG, GIF) Exemplo: <IMG ALT="Esta é uma figura!" SRC="colorbar.gif"> |