Tudo sobre HTML 35
26 pág.

Tudo sobre HTML 35


DisciplinaAnálise Textual9.509 materiais293.875 seguidores
Pré-visualização6 páginas
<H5>Tamanho5</H5> <BR> 
<H6>Tamanho6</H6> <BR> 
Texto1 - <FONT COLOR=Blue>Cor Azul</FONT> <BR> 
Texto2 - <FONT FACE=&quot;Times New Roman&quot;>Fonte Times New Roman</FONT> <BR> 
Texto3 - <B>Negrito</B> <BR> 
Texto4 - <I>Itálico</I> <BR> 
Texto5 - <TT>Monoespaçado</TT> <BR> 
Texto6 - <U>Sublinhado</U> <BR> 
Texto7 - <SUP>Sobscrito</SUP> <BR> 
Texto8 - <SUB>Subscrito</SUB> <BR> 
Texto9 - <S>Taxado</S> <P> 
</BODY> 
</HTML> 
Caracteres Especiais 
 Alguns caracteres especiais são tratados de uma maneira diferente na Web, pelo fato 
de que nem todos os computadores ligados à Internet estão configurados para visualizar 
os acentos. Existe uma codificação que permite a qualquer equipamento interpretar os 
códigos e exibir na tela o caracter desejado. 
 Os códigos funcionam da seguinte maneira: 
\uf0b7 Primeiro colocamos o caracter &; 
\uf0b7 Em seguida a letra que deverá ser acentuada; 
\uf0b7 Coloque a acentuação desejada; 
\uf0b7 Acrescente o &quot;;&quot; (ponto e virgula). 
 Relacionamos abaixo alguns dos caracteres e acentos da HTML: 
Acentos e Caracteres Código 
Agudo &_acute; 
Grave &_grave; 
Circunflexo &_circ; 
Til &_tilde; 
Trema &_uml; 
Cedilha &_cedil; 
& &amp; 
< &lt; 
> &gt; 
© &copy; 
&quot; &quot; 
(espaço em branco) &nbsp; 
 
 
Âncoras e Links 
Âncoras (Links) 
 Para inserir um link, ou seja, uma ligação de uma região do texto (ou imagem) a um 
outro documento é nescessário usar o tag <A>, da seguinte forma: 
<A HREF=&quot;arq_dest&quot;> âncora </A> onde arq_dest é o URL do documento de destino, 
âncora é o texto ou imagem que servirá de ligação hipertexto do documento sendo 
apresentado para o documento de destino. 
Existem 3 caminhos para se referir um documento de destino: 
1. Caminho relativo - Pode ser usado sempre que quiser fazer referência a um 
documento que esteja no mesmo servidor do documento atual. 
<A HREF=&quot;apresentacaodalicao.html&quot;></A>. 
2. Caminho Absoluto - Quando se quer fazer referência a um documento que esteja 
em outro servidor. 
<A HREF=&quot;http://www.terravista.pt/ancora/3300&quot;></A>. 
3. Ligação com trechos da mesma página - Desvia para o local do trecho desejado 
na mesma página. 
Colocarei um exemplo, como se você quisesse voltar para o início dessa página: 
o Coloque o nome em algum local que você quer que o link se dirija. Como 
esse comando colocado no início da página: 
<A NAME=&quot;inicio&quot;></A>. 
o Agora faça o link para essa âncora, como a seguir: 
<A HREF=&quot;#inicio&quot;></A>. 
NOTA: Para você colocar o endereço de seu e-mail na sua página você tem que colocar 
da seguinte forma: 
<A HREF=&quot;mailto:seu_e-mail&quot;> seu_e-mail </A> 
 
 
Imagens e Animações 
Imagens 
 Com relação de uso de imagens na Web temos que estas se dividem em duas 
categorias gerais que são as imagens in-line e as externas. As imagens in-line são 
apresentadas na página junto com os vínculos e com o texto e são carregadas 
automaticamente. Já as imagens externas são carregadas somente por demanda 
(download), através de vínculos. 
 Independente de sua categoria, as imagens podem se apresentar em dois formatos: 
.gif e .jpg. 
\uf0b7 GIF - Este padrão é mais conhecido e mais compatível com os navegadores 
existentes. Recomendado para ícones com menos de 256 cores, cores lisas, 
puras, preto e branco. Sua qualidade é bem superior ao formato JPG, pois o 
tamanho do arquivo é maior.Suas imagens podem ser transparentizadas. 
\uf0b7 JPG ou JPEG - Foi o padrão proposto pelo comitê ISO e é geralmente usado para 
imagens mais complexas (fotográficas). Permite alta taxa de compressão, por 
isso gera um arquivo menor, o que implica numa perda de informação e 
qualidade. 
 O elemento IMG, ou seja, a tag <IMG>, insere as imagens que serão apresentadas 
junto ao texto. Um atributo SRC, que é o mais importante dessa tag, deve estar presente 
da seguinte forma: 
 Se a imagem estiver na mesma pasta que a sua página então a tag seria assim: 
<IMG SRC=&quot;nome_imagem.extenção&quot;> 
 Se a imagem estiver em uma pasta diferente da que sua página está, então você tem 
que colocar o endereço desta pasta e depois o arquivo que contém a sua imagem. 
Digamos que sua página esta na pasta &quot;pagina&quot; e a imagem (img.gif) que você vai 
colocar esta na pasta &quot;imagens&quot; que esta dentro da pasta &quot;pagina&quot;, ou seja, essa 
imagem está dentro da pasta &quot;\imagens\img.gif&quot;. Então a tag seria: 
<IMG SRC=&quot;imagens\img.gif&quot;> 
 DICA: Se você quiser colocar uma imagem que está em outra página, basta clicar 
com o botão direito do mouse em cima da imagem e seleciona o opção propriedades e 
copiar a endereço URL e colocar no atributo SRC. 
 Juntamente com a tag <IMG> podemos usar alguns parâmetros como: 
\uf0b7 BORDER - para determinar a moldura da imagem; 
\uf0b7 WIDTH - para determinar a largura da imagem; 
\uf0b7 HEIGHT - para determinar a altura da imagem; 
\uf0b7 ALIGN - para alinhar as imagens de várias formas: 
LEFT - alinha a imagem a esquerda do texto; 
RIGHT - alinha a imagem a direita do texto; 
TOP - alinha o texto com o topo da imagem; 
MIDDLE - alinha o texto com o meio da imagem; 
BOTTOM - alinah o texto com a parte inferior da imagem. 
\uf0b7 ALT - quando a pessoa deixar o mouse sobre a imagem aparecerá o que você 
escreveu. 
Por exemplo: 
<IMG ALT=&quot;explicação da imagem&quot; BORDER=4 WIDTH=50 HEIGHT=20 ALIGN=Left> 
 Uma imagem pode funcionar como vínculo, incluindo-se a tag <IMG> entre as partes 
de abertura e fechamento de uma tag de vínculo <A>. Assim temos: 
<A HREF=&quot;arq.html&quot;><IMG SCR=&quot;img.gif&quot;></A> 
 Para se projetar uma página deve-se procurar um equilíbrio com relação a 
quantidade de imagens e cores e a necessidade de transmissão de informações. O uso 
excessivo de imagens, imagens grandes, poinéis de fundo tornará a página mais lenta 
ao ser carregada e o que, em muitos casos, levará os usuários que tiverem uma conexão 
lenta de rede a desistirem de carregar esta página. Para que isso não aconteça, verifique 
a nexessidade do uso dessa ou daquela imagem, mantenha as imagens pequenas 
reutilize-as sempre que possível. 
Animações 
 Com relação ao uso de mídias em HTML é necessário a utilização de vínculos 
correspondente ao caminho URL do arquivo externo que se deseja inserir em sua 
página.<A REF=&quot;arq_ext&quot;>Arquivo</A>. Neste contexto entram os arquivos de som e 
vídeo. 
Som 
 O primeiro caso, o som, é utilizado para transmitir informações que não sejam na 
forma de ilustração ou palavras e até mesmo para desejar boas vindas ao usuário que 
acaba de carregar aquela página. Esses arquivos geralmente possuem extenção .waw e 
.mid. 
 Agora vamos aos comandos: 
 <EMBED> 
 <BGSOUND> 
 Como o comando <EMBED> não é aceito pelo IE 3.0 e alguns outros browsers 
desconhecidos, você terá que colocar o comando duas vezes, um com o <EMBED> para 
o Netscape e <BGSOUND> para outros Browsers. 
 Esta tags pode conter os seguintes parâmetros: 
\uf0b7 SRC - define o caminho para o arquivo de som; 
\uf0b7 AUTOSTART - define que ao ser carregado ele já deve ser tocado ou que o 
visitante deve clicar no play para tocar, TRUE para tocar automaticamente e 
FALSE para quando o visitante apertar play. 
\uf0b7 AUTOLOAD - define que ele deve ser automaticamente começado a baixar o 
arquivo de som quando entrar na página, ou o visitante deve apertar o play para 
baixar o arquivo, TRUE para baixar automaticamente e FALSE para quando o 
visitante apertar play. 
\uf0b7 LOOP - define o número de vez que a música será tocada, TRUE para tocar 
infinitas vezes. 
\uf0b7 HIDDEN - define se você quer que o controle ficam sumidos ou não, TRUE para 
deixar invisível e caso queira os controles não precisa colocar FALSE. 
\uf0b7 WIDHT e HIGHT define o tamanho dos controles. 
 Então os comandos de sua página ficariam assim: 
 <EMBED SCR=&quot;musica.mid&quot; AUTOSTART=&quot;true&quot; AUTOLOAD=&quot;true&quot; LOOP=&quot;true&quot; 
HIDDEN=&quot;true&quot;> 
 <BGSOUND SCR=&quot;musica.mid&quot; AUTOSTART=&quot;true&quot; AUTOLOAD=&quot;true&quot; 
LOOP=&quot;true&quot; HIDDEN=&quot;true&quot;> 
Vídeo 
 Já os arquivos de vídeos fornecem informações que as imagens