SlideShare a Scribd company logo
1 of 15
Caracteres especiales y enlaces
Caracteres especiales
El uso de acentos, signos de apertura de interrogación y
exclamación, eñes, espacio en blanco, etc.
• incluir en nuestros textos, signos que tienen un
significado especial en HTML.
• Los nombres de las entidades están compuestos por el
signo(&), luego el nombre de la entidad y al final (";" -
punto y coma).
• Los números de estos caracteres están compuestos por
(&), luego (# - numeral), el número de la entidad y al
final (";" - punto y coma).
Caracteres especiales básicos
• En realidad estos
caracteres se usan en
HTML para no confundir
un principio o final de
etiqueta, unas comillas o
un & con su
correspondiente
carácter.
&lt; < &gt; >
&amp; & &quot; "
Caracteres especiales del HTML 2.0
&Aacute; Á &Agrave; À
&Eacute; É &Egrave; È
&Iacute; Í &Igrave; Ì
&Oacute; Ó &Ograve; Ò
&Uacute; Ú &Ugrave; Ù
&aacute; á &agrave; à
&eacute; é &egrave; è
&iacute; í &igrave; ì
&oacute; ó &ograve; ò
&uacute; ú &ugrave; ù
&Auml; Ä &Acirc; Â
&Euml; Ë &Ecirc; Ê
&Iuml; Ï &Icirc; Î
&Ouml; Ö &Ocirc; Ô
&Uuml; Ü &Ucirc; Û
&auml; ä &acirc; â
&euml; ë &ecirc; ê
&iuml; ï &icirc; î
&ouml; ö &ocirc; ô
&uuml; ü &ucirc; û
&Atilde; Ã &aring; å
&Ntilde; Ñ &Aring; Å
&Otilde; Õ &Ccedil; Ç
&atilde; ã &ccedil; ç
&ntilde; ñ &Yacute; Ý
&otilde; õ &yacute; ý
&Oslash; Ø &yuml; ÿ
&oslash; ø &THORN; Þ
&ETH; Ð &thorn; þ
&eth; ð &AElig; Æ
&szlig; ß &aelig; æ
Caracteres especiales del HTML 3.2
&frac12; ½ &iexcl; ¡
&frac34; ¾ &pound; £
&copy; © &yen; ¥
&reg; ® &sect; §
&ordf; ª &curren; ¤
&sup2; ² &brvbar; ¦
&sup3; ³ &laquo; «
&sup1; ¹ &not; ¬
&macr; ¯ &shy;
&micro; µ &ordm; º
&para; ¶ &acute; ´
&middot; · &uml; ¨
&deg; ° &plusmn; ±
&cedil; ¸ &raquo; »
&iquest; ¿
Otros caracteres especiales
&times; × &cent; ¢
&divide; ÷ &euro; €
&#147; “ &#153; ™
&#148; ” &#137; ‰
&#140; Œ &#131; ƒ
&#135; ‡ &#134; †
Enlaces html
FUNCIONES Y TIPOS
En función del destino los enlaces son clásicamente agrupados del siguiente
modo:
• Enlaces internos: los que se dirigen a otras partes dentro de la misma página.
• Enlaces locales: los que se dirigen a otras páginas del mismo sitio web.
• Enlaces remotos: los dirigidos hacia páginas de otros sitios web.
• Enlaces con direcciones de correo: para crear un mensaje de correo dirigido a
una dirección.
• Enlaces con archivos: para que los usuarios puedan hacer download de
ficheros.
Los enlaces en HTML se crean mediante la etiqueta <a> y </a>
( "anchor", literalmente traducido como "ancla").
El atributo más importante de la etiqueta <a> es href, que se utiliza para
indicar la URL a la que apunta el enlace. La sintaxis general de un enlace
es por tanto de la forma:
<a href="destino">contenido</a>
<a href="http://www.google.com">Página principal de Google</a>
Como el atributo href indica una URL, un enlace puede apuntar a
cualquier tipo de recurso al que pueda acceder el navegador
IMAGEN:
<a href="http://www.ejemplo.com/fondo_escritorio.jpg">Imagen interesante
para un fondo de escritorio</a>
DOCUMENTOS:
<a href="http://www.ejemplo.com/informe.pdf">Descargar informe completo
[PDF]</a> <a href="http://www.ejemplo.com/informe.doc">Descargar informe
completo [DOC]</a>
Enlaces
Hipertextos - hiperenlaces o anclajes:
El elemento <A> (la A corresponde al inglés Anchor)
<A HREF="http://www.htmlpoint.com">Visita HTMLpoint</A>
Cargar una página asociada a HREF en otra ventana del navegador:
<A HREF="http://www.htmlpoint.com" TARGET="_new">Visita HTMLpoint</A>
Visita HTMLpoint
Definir un texto con un comentario que se activará cuando pasemos el ratón por encima del enlace:
<A HREF="http://www.htmlpoint.com" TITLE="El sitio italiano sobre el web publishing">Visita
HTMLpoint</A>
Visita HTMLpoint
Enlaces con direcciones de correo electrónico :
<A HREF="mailto:webmaster@html.it">Escribe a HTMLpoint</A>
Escribe a HTMLpoint
ENLACES INTERNOS
• El otro atributo básico de la etiqueta <a> es name, que permite definir
enlaces dentro de una misma página web. Si una página es muy larga, puede
ser útil mostrar enlaces de tipo:
"Saltar hasta la segunda sección", "Volver al principio de la página", etc.
1. Lo primero será colocar nuestro enlace origen. Lo pondremos aquí mismo y
lo escribiremos del siguiente modo:
<a href="#abajo">Ir abajo</a>
El símbolo #; es él quien especifica al navegador que el enlace apunta a una
sección en particular.
• En segundo lugar, hay que generar un enlace en el destino. Este enlace llevara
por nombre abajo para poder distinguirlo de los otros posibles enlaces
realizados dentro de la misma página. En este caso, la etiqueta que
escribiremos será ésta:
<a name="abajo"></a>
El atributo name permite crear "enlaces vacíos" que hacen referencia a secciones
dentro de una misma página. Una vez definidos los "enlaces vacíos", es posible
crear un enlace que apunte directamente a una sección concreta de una página:
<!-- Enlace normal a la página --> <a
href="http://www.ejemplo.com/pagina1.html">Enlace a la página
1</a> <!—
Enlace directo a la segunda sección de la página --> <a
href="http://www.ejemplo.com/pagina1.html#segunda_seccion">Enlace a la
sección 2 de la página 1</a>
Enlaces locales
• Para crear este tipo de enlaces, hemos de crear una etiqueta de la
siguiente forma:
<a href="archivo.html">contenido</a>
• <a href="archivo.html#seccion">contenido</a>
• <a name="seccion"></a>
• http://www.desarrolloweb.com/articulos/574.php
• http://www.desarrolloweb.com/articulos/575.php
• http://www.desarrolloweb.com/manuales/21/
BLIBLIOGRAFIA

More Related Content

Similar to Caracteres y enlaces (20)

Manual html
Manual htmlManual html
Manual html
 
Etiquetas Html Udp
Etiquetas Html UdpEtiquetas Html Udp
Etiquetas Html Udp
 
Html
HtmlHtml
Html
 
Html
HtmlHtml
Html
 
Clase HTML.pptx
Clase HTML.pptxClase HTML.pptx
Clase HTML.pptx
 
Html.pptx
Html.pptxHtml.pptx
Html.pptx
 
Producto 3
Producto 3Producto 3
Producto 3
 
Newton mauricio mina c
Newton mauricio mina cNewton mauricio mina c
Newton mauricio mina c
 
Newton mauricio mina c
Newton mauricio mina cNewton mauricio mina c
Newton mauricio mina c
 
Manual de-html
Manual de-htmlManual de-html
Manual de-html
 
Diseño
DiseñoDiseño
Diseño
 
CODIGOS HTML.Magdalena ortega de nariño.
CODIGOS HTML.Magdalena ortega de nariño.CODIGOS HTML.Magdalena ortega de nariño.
CODIGOS HTML.Magdalena ortega de nariño.
 
Html Sharon 4101
Html Sharon 4101Html Sharon 4101
Html Sharon 4101
 
DISEÑO WEB - HTML 5 - PRINCIPIOS BASICOS.pptx
DISEÑO WEB - HTML 5 - PRINCIPIOS BASICOS.pptxDISEÑO WEB - HTML 5 - PRINCIPIOS BASICOS.pptx
DISEÑO WEB - HTML 5 - PRINCIPIOS BASICOS.pptx
 
Códigos HTML Sede magdalena ortega de Nariño
Códigos HTML Sede magdalena ortega  de NariñoCódigos HTML Sede magdalena ortega  de Nariño
Códigos HTML Sede magdalena ortega de Nariño
 
ETIQUETAS
ETIQUETASETIQUETAS
ETIQUETAS
 
Tema 02 trabajando con texto en html
Tema 02 trabajando con texto en htmlTema 02 trabajando con texto en html
Tema 02 trabajando con texto en html
 
Expo html
Expo htmlExpo html
Expo html
 
Presentación HTML
Presentación HTML Presentación HTML
Presentación HTML
 
Crear una página básica en HTML
Crear una página básica en HTMLCrear una página básica en HTML
Crear una página básica en HTML
 

Caracteres y enlaces

  • 2. Caracteres especiales El uso de acentos, signos de apertura de interrogación y exclamación, eñes, espacio en blanco, etc.
  • 3. • incluir en nuestros textos, signos que tienen un significado especial en HTML. • Los nombres de las entidades están compuestos por el signo(&), luego el nombre de la entidad y al final (";" - punto y coma). • Los números de estos caracteres están compuestos por (&), luego (# - numeral), el número de la entidad y al final (";" - punto y coma).
  • 4. Caracteres especiales básicos • En realidad estos caracteres se usan en HTML para no confundir un principio o final de etiqueta, unas comillas o un & con su correspondiente carácter. &lt; < &gt; > &amp; & &quot; "
  • 5. Caracteres especiales del HTML 2.0 &Aacute; Á &Agrave; À &Eacute; É &Egrave; È &Iacute; Í &Igrave; Ì &Oacute; Ó &Ograve; Ò &Uacute; Ú &Ugrave; Ù &aacute; á &agrave; à &eacute; é &egrave; è &iacute; í &igrave; ì &oacute; ó &ograve; ò &uacute; ú &ugrave; ù &Auml; Ä &Acirc; Â &Euml; Ë &Ecirc; Ê &Iuml; Ï &Icirc; Î &Ouml; Ö &Ocirc; Ô &Uuml; Ü &Ucirc; Û &auml; ä &acirc; â &euml; ë &ecirc; ê &iuml; ï &icirc; î &ouml; ö &ocirc; ô &uuml; ü &ucirc; û &Atilde; Ã &aring; å &Ntilde; Ñ &Aring; Å &Otilde; Õ &Ccedil; Ç &atilde; ã &ccedil; ç &ntilde; ñ &Yacute; Ý &otilde; õ &yacute; ý &Oslash; Ø &yuml; ÿ &oslash; ø &THORN; Þ &ETH; Ð &thorn; þ &eth; ð &AElig; Æ &szlig; ß &aelig; æ
  • 6. Caracteres especiales del HTML 3.2 &frac12; ½ &iexcl; ¡ &frac34; ¾ &pound; £ &copy; © &yen; ¥ &reg; ® &sect; § &ordf; ª &curren; ¤ &sup2; ² &brvbar; ¦ &sup3; ³ &laquo; « &sup1; ¹ &not; ¬ &macr; ¯ &shy; &micro; µ &ordm; º &para; ¶ &acute; ´ &middot; · &uml; ¨ &deg; ° &plusmn; ± &cedil; ¸ &raquo; » &iquest; ¿
  • 7. Otros caracteres especiales &times; × &cent; ¢ &divide; ÷ &euro; € &#147; “ &#153; ™ &#148; ” &#137; ‰ &#140; Œ &#131; ƒ &#135; ‡ &#134; †
  • 9. FUNCIONES Y TIPOS En función del destino los enlaces son clásicamente agrupados del siguiente modo: • Enlaces internos: los que se dirigen a otras partes dentro de la misma página. • Enlaces locales: los que se dirigen a otras páginas del mismo sitio web. • Enlaces remotos: los dirigidos hacia páginas de otros sitios web. • Enlaces con direcciones de correo: para crear un mensaje de correo dirigido a una dirección. • Enlaces con archivos: para que los usuarios puedan hacer download de ficheros.
  • 10. Los enlaces en HTML se crean mediante la etiqueta <a> y </a> ( "anchor", literalmente traducido como "ancla"). El atributo más importante de la etiqueta <a> es href, que se utiliza para indicar la URL a la que apunta el enlace. La sintaxis general de un enlace es por tanto de la forma: <a href="destino">contenido</a> <a href="http://www.google.com">Página principal de Google</a> Como el atributo href indica una URL, un enlace puede apuntar a cualquier tipo de recurso al que pueda acceder el navegador IMAGEN: <a href="http://www.ejemplo.com/fondo_escritorio.jpg">Imagen interesante para un fondo de escritorio</a> DOCUMENTOS: <a href="http://www.ejemplo.com/informe.pdf">Descargar informe completo [PDF]</a> <a href="http://www.ejemplo.com/informe.doc">Descargar informe completo [DOC]</a>
  • 11. Enlaces Hipertextos - hiperenlaces o anclajes: El elemento <A> (la A corresponde al inglés Anchor) <A HREF="http://www.htmlpoint.com">Visita HTMLpoint</A> Cargar una página asociada a HREF en otra ventana del navegador: <A HREF="http://www.htmlpoint.com" TARGET="_new">Visita HTMLpoint</A> Visita HTMLpoint Definir un texto con un comentario que se activará cuando pasemos el ratón por encima del enlace: <A HREF="http://www.htmlpoint.com" TITLE="El sitio italiano sobre el web publishing">Visita HTMLpoint</A> Visita HTMLpoint Enlaces con direcciones de correo electrónico : <A HREF="mailto:webmaster@html.it">Escribe a HTMLpoint</A> Escribe a HTMLpoint
  • 12. ENLACES INTERNOS • El otro atributo básico de la etiqueta <a> es name, que permite definir enlaces dentro de una misma página web. Si una página es muy larga, puede ser útil mostrar enlaces de tipo: "Saltar hasta la segunda sección", "Volver al principio de la página", etc. 1. Lo primero será colocar nuestro enlace origen. Lo pondremos aquí mismo y lo escribiremos del siguiente modo: <a href="#abajo">Ir abajo</a> El símbolo #; es él quien especifica al navegador que el enlace apunta a una sección en particular. • En segundo lugar, hay que generar un enlace en el destino. Este enlace llevara por nombre abajo para poder distinguirlo de los otros posibles enlaces realizados dentro de la misma página. En este caso, la etiqueta que escribiremos será ésta: <a name="abajo"></a>
  • 13. El atributo name permite crear "enlaces vacíos" que hacen referencia a secciones dentro de una misma página. Una vez definidos los "enlaces vacíos", es posible crear un enlace que apunte directamente a una sección concreta de una página: <!-- Enlace normal a la página --> <a href="http://www.ejemplo.com/pagina1.html">Enlace a la página 1</a> <!— Enlace directo a la segunda sección de la página --> <a href="http://www.ejemplo.com/pagina1.html#segunda_seccion">Enlace a la sección 2 de la página 1</a>
  • 14. Enlaces locales • Para crear este tipo de enlaces, hemos de crear una etiqueta de la siguiente forma: <a href="archivo.html">contenido</a> • <a href="archivo.html#seccion">contenido</a> • <a name="seccion"></a>