Apostila_HTML_CSS_E-Jovem 11
73 pág.

Apostila_HTML_CSS_E-Jovem 11


DisciplinaAnálise Textual9.475 materiais293.877 seguidores
Pré-visualização17 páginas
ligação hipertexto do documento, 
sendo apresentado para o documento de destino.
Atributos
A TAG <A> tem vários atributos que são utilizados de acordo com a ação associada ao link. 
Os mais usados são apresentados a seguir:
HREF Indica o arquivo de destino da ligação de hipertexto.
TARGET Indica o frame em que será carregado o arquivo_destino. Maiores detalhes na 
seção sobre frames.
NAME
Marca um indicador, isto é, uma região de um documento como destino de 
uma ligação.
Projeto e­Jovem ­ Módulo II: HTML 22
1.12.1.  Caminhos (uso de Links)
Os links podem estar indicados como caminhos relativos ou absolutos.
1.12.2.  Caminho Relativo
O caminho relativo pode ser usado sempre que queremos fazer referência a um documento 
armazenado no mesmo servidor do documento atual.
Através   do   campo   de   endereços   do   browser,   é   possível   identificar   se   um   documento 
(página) que está   sendo visualizado está  dentro de algum diretório (pasta).  Como, por 
exemplo, se estivermos em um browser acessando a página da FACCAT e vemos o seguinte 
endereço:   http://www.faccat.br/apostilas/apostila_de_informatica.html.   O   que   podemos 
concluir   é   que   o   documento   que   está   sendo   visualizado   no   momento,   chamado 
apostila_de_informatica.html,   está   localizado   dentro   de   um   diretório   (pasta)   chamado 
apostilas do servidor www.faccat.br.
Então, para escrevermos um link deste documento (apostila_de_informatica.html) para um 
documento chamado (doc.html), que está localizado no diretório /apostilas/documentos/, 
do mesmo servidor (www.faccat.br), tudo que precisamos fazer é escrever:
<A HREF=&quot;documentos/doc.html&quot;> Exemplo de Caminho Relativo </A>
Para   usar   links   com   caminhos   relativos   é   preciso,   portanto,   conhecer   a   estrutura   do 
diretório do servidor no qual estamos trabalhando, pois devemos indicar todo o caminho 
onde está o documento a que estamos nos referindo no link. Quando há alguma dúvida, o 
melhor é usar o caminho absoluto.
1.12.3.  Caminho Absoluto
Utilizamos o caminho absoluto quando desejamos referenciar um documento que esteja em 
outro servidor, por exemplo:
<A HREF=&quot;http://www.faccat.br&quot;> FACCAT ­ Faculdades de Taquara </A>
Que oferece um link FACCAT ­ Faculdades de Taquara que ao ser clicado com o mouse 
abrirá a página, cujo endereço é: http://www.faccat.br.
Com a mesma sintaxe, é possível escrever links para qualquer servidor de informações da 
Internet.
1.12.4.  Indicadores (uso de Links)
Como foi dito anteriormente, o atributo NAME permite indicar um trecho de documento 
como ponto de chegada de uma ligação hipertexto.
A formatação:
<A NAME=&quot;inicio&quot;> Indicadores (uso de links) </A> faz com que a âncora Indicadores 
(uso de links) seja o destino de um link.
Se escrevermos:
<A HREF=&quot;#inicio&quot;> Topo do Documento </A> , teremos uma ligação hipertexto para 
um trecho deste mesmo documento.
Projeto e­Jovem ­ Módulo II: HTML 23
Exercício 8: 
Vamos   agora   treinar   os   indicadores.   Vamos   fazer   uma   página   sobre   as   ferramentas 
estudadas até aqui.   Ou seja, elabore um pequeno texto sobre: Inkscape, Gimp, BrOffice. 
Faça no início da página um link para cada um dos conteúdos. E em cada conteúdo, dê a 
opção para ir ao topo. Veja como vai funcionar isso. Salve como \u201cFerramentas_Livres\u201d
Exercício 9:
Agora, vamos criar links entre suas páginas criadas. Crie uma página chamada \u201cindex.html\u201d 
com os links de todas as páginas criadas até agora. Se preferir (o que é importante), em 
cada página crie os mesmos links para o acesso mais rápido.
1.13.  Lista de caracteres
HTML permite  que  caracteres  especiais   sejam representados  por   sequências  de  escape, 
indicadas por três partes: um & inicial, um número ou cadeia de caracteres correspondente 
ao caractere desejado, e um ; final. 
Quatro caracteres ASCII ­ <, >, e & têm significados especiais em HTML, e são usados 
dentro de documentos, seguindo a correspondência: 
1.13.1.  Caracteres Acentuados no Português e especiais
á &aacute; Á &Aacute; ã &atilde; Ã &Atilde;
â &acirc; Â &Acirc; à &agrave; À &Agrave;
é &eacute; É &Eacute; ê &ecirc; Ê &Ecirc;
í &iacute; Í &Iacute; ó &oacute; Ó &Oacute;
õ &otilde; Õ &Otilde; ô &ocirc; Ô &Ocirc;
ú &uacute; Ú &Uacute; ü &uuml; Ü &Uuml;
ç &ccedil; Ç &Ccedil;
1.13.2.  Caracteres Especiais
\u201c e \u201d aspas duplas &ldquo; e &rdquo; \u2660 espadas &spades;
\u2018 e \u2019 aspas simples  &lsquo; e &rsquo; \u2663 paus &clubs;
\u2039 e \u203a aspas angulares simples  &lsaquo; e &rsaquo; º ordenal masculino &ordm;
« e » aspas angulares duplas &laquo; e &raquo; ª ordinal feminino &ordf;
  espaço &nbsp; \u2013 travessão \u2018en\u2019 &ndash;
& e comercial &amp; \u2014travessão \u2018em\u2019 &mdash;
> maior que &gt; hífen oculto &shy;
< menor que &lt; \u2c9 macron &macr;
\u2c6 acento circunflexo &circ; \u2026reticências &hellip;
\u2dc acento til &tilde; ¦ barra vertical &brvbar;
¨ acento trema &uml; \u2022 marcador (bullet) &bull;
´ acento agudo &cute; ¶ parágrafo &para;
¸ cedilha &cedil; \u2665 copas &hearts;
&quot; aspas duplas &quot; \u2666 ouros &diams;
§ parágrafo legal &sect;
Projeto e­Jovem ­ Módulo II: HTML 24
1.13.3.  Caracteres Comerciais
© copyright &copy; ¢ centavo &cent;
® marca registrada &reg \u20ac euro &euro;
\u2122 trade mark &trade; ¥ iene (yen) &yen;
£ libra esterlina &pound; ¤ símbolo monetário &curren;
1.13.4.  Caracteres Matemáticos e Lógicos
¹ elevado a um &sup1; ± mais ou menos &plusmn;
² ao quadrado &sup2; \u2212 sinal de subtração &minus;
³ ao cubo &sup3; × sinal de multiplicação &times;
½ um meio &frac12; ÷ sinal de divisão &divide;
¼ um quarto &frac14; \u2217 Asterisco &lowast;
¾ três quartos &frac34;  \u2215 barra de fração &frasl;
> maior que &gt; \u2030 por­mil &permil;
< menor que &lt; \u222b sinal de integral &int;
\u2211 somatório &sum; \u2260 Diferente &ne;
\u220f PI &prod; \u2264 menor ou igual &le;
\u221a raiz quadrada &radic; \u2265 maior ou igual &ge;
\u221e infinito &infin; \u2234 consequentemente &there4;
\u2248 quase igual &asymp; \u22c5 Ponto &sdot;
\u2245 Aprox. igual &cong; \u2219 ponto do meio &middot;
\u221d proporcional &prop; \u2202 diferença parcial &part;
\u2261 idêntico &equiv; \u2111 parte imaginária do número&image;
\u211c parte real do número &real; \u2033 segundo &Prime;
\u2032 minuto &prime; ° grau &deg;
\u2220 Ângulo &ang; \u2208 elemento de/pertence a &isin;
\u22a5 perpendicular &perp; \u2209 nã é elemento de &notin;
\u2207 Nabla &nabla; \u2229 Interseção &cap;
\u2295 soma direta &oplus; \u222a União &cup;
\u2297 produto de vetor &otimes; \u2282 subconjunto de &sub;
\u2135 Alef &alefsym; \u2283 superconjunto de &sup;
ø produto vazio &oslash; \u2286 subconjunto de ou igual a &sube;
Ø produto vazio &Oslash; \u2287 superconjunto de ou igual a &supe;
\u2203 existe &exist;  \u2191 e \u2193 setas simples &uarr; e &darr;
\u2200 qualquer &forall; \u2194 seta simples &harr;
\u2205 vazio &empty; \u21d0 e \u21d2 setas duplas &lArr; e &hrrr;
¬ não lógico &not; \u21d1 e \u21d3 setas duplas &uArr; e &dArr;
\u2227 e lógico &and; \u21d4 seta dupla &hArr;
\u2228 ou lógico &or; \u2308 e \u2309 teto (esquerdo e direito) &lceil; e &rceil;
Projeto e­Jovem ­ Módulo II: HTML 25
\u21b5 retorno de carro &crarr; \u230a e \u230b piso (esquerdo e direito) &lfloor; e &rfloor;
 \u2190 e \u2192 setas simples &larr; e 
&rarr;
\u25ca losango &loz;
1.13.5.  Outros Acentos e Caracteres Especiais
ñ &ntilde; Ñ &Ntilde; ¡ &iexcl; ¿ &iquest;
ä &auml; Ä &Auml; å &aring; Å &Aring;
ë &euml; Ë &Euml; è &grave; È &Egrave;
ï &iuml; Ï &Iuml; ì &igrave; Ì &Igrave;
î &icirc; Î &Icirc; ò &ograve; Ò &Ograve;
ö &ouml; Ö &Ouml; û &ucirc; Û &Ucirc;
ù &ugrave; Ù &Ugrave; ÿ &yuml; \u178 &Yuml;
ý &yacute; Ý &Yacute; \u153 &oelig; \u152 &OElig;
æ &aelig; Æ &AElig; \u161 &scaron; \u160 &Scaron;
\u2020 &dagger; \u2021 &Dagger; ð &eth; Ð &ETH;
þ &thorn; Þ &THORN; ß &szlig; µ &micro;
§ &sect; \u192 &fnof;
1.13.6.  Caracteres Gregos
\u3b1 &alpha; \u391 &Alpha; \u3b2 &beta; \u392 &Beta;
\u3b4 &delta; \u394 &Delta; \u3b5 &epsilon; \u395 &Epsilon;
\u3b7 &eta; \u397 &Eta; \u3b8 &theta; \u398 &Theta;
\u3ba &kappa; \u39a &Kappa; \u3bb &lambda; \u39b &Lambda;
\u3bd &nu; \u39d &Nu; \u3be &xi; \u39e &Xi;
\u3c0 &pi; \u3a0 &Pi; \u3c1 &rho; \u3a1 &Rho;
\u3c2 &sigmaf; \u3c4 &tau; \u3a4 &Tau; \u3c5 &upsilon;
\u3a6 &Phi; \u3c7 &chi; \u3a7 &Chi; \u3c8 &psi;
\u3a9 &Omega; \u3d1 &thetasym; \u3d2 &upsih; \u3d6 &piv;
\u3b3 &gamma; \u393 &Gamma; \u3bf &omicron; \u39f &Omicron;
\u3b6 &zeta; \u396 &Zeta; \u3c3 &sigma; \u3a3 &Sigma;
\u3b9 &iota; \u399 &Iota; \u3a5 &Upsilon; \u3c6 &phi;
\u3bc &mu; \u39c &Mu; \u3a8 &Psi; \u3c9 &omega;
Projeto e­Jovem