MARCAS DE IMAGEN

NCD Guía de Diseño en HTML v6.0

+ Imagen Básica

<img src=#> #=URL de la Imagen

Texto Alterno <img alt=#>
#= Texto alterno para navegador de texto (tipo lynx) o uno que no cargue imágenes. 

<img src="f.gif" alt="MI CARA :-)">
 MI CARA :-)

Baja Definición <img lowsrc=#1 src=#2>
#1=URL de Imagen de Baja Resolución (para cargar rápidamente)
#2=URL de la imagen final




+ Imagen alineada con Texto

<img align=#> #=top, middle, bottom

<img align=#> #=absmiddle, absbottom, texttop, baseline

<img src=URL align=top> 
Mi cara! <img src=heno01.gif>
 (^_^) Mi cara!
  
<img src=URL align=middle> 
Mi cara! <img src=heno01.gif>
 (^_^) Mi cara!
  
<img src=URL align=bottom> 
Mi cara! <img src=heno01.gif>
 (^_^) Mi cara!
  
<img src=URL align=texttop> 
Mi cara! <img src=heno01.gif>
 (^_^) Mi cara!
  
<img src=URL align=absmiddle> 
Mi cara! <img src=heno01.gif>
 (^_^) Mi cara!
  
<img src=URL align=absbottom> 
Mi cara! <img src=heno01.gif>
 (^_^) Mi cara!
  
<img src=URL align=baseline> 
Mi cara! <img src=heno01.gif>
 (^_^) Mi cara!
 


+ Imagen Flotante

<img align=left> 

<img src=URL align=left>
Mi cara!<br>
Está siempre<br>
sonriendo.<br>
Jajaja....<br>
 (^_^)Mi cara!
Está siempre
sonriendo.
Jajaja....



<img align=right>
(^_^)Mi cara!
Está siempre
sonriendo.
Jajaja....



<br clear=#>    #=left, right, all 

<img src=URL align=left>Mi cara!<br>
Está siempre
<br clear=all>
sonriendo.<br>
Jajaja....<br>
 (^_^)Mi cara!
Está siempre

sonriendo.
Jajaja....


<img vspace=# hspace=#> #=valor 

<img src=URL align=left 
vspace=10 hspace=20>Mi cara!<br>
Está siempre<br>
sonriendo.<br>
Jajaja....<br>
 (^_^)Mi cara!
Está siempre
sonriendo.
Jajaja....



+ Tamaño de la Imagen

<img width=# height=#> #=valor 

<img src=URL.gif
 width=100 height=30>
 (^_^)


+ Linea de Borde

<img border=#> #=valor 

<a href="URL.htm">
<img src=URL.gif border=15>
</a>
 (^_^)


+ Mapa de Imagen Lado-Cliente

<img src=img.gif usemap="Nombre-Mapa">

<map name="Nombre-Mapa">
<area shape="#" coords="#" href="url">
<area shape="#" coords="#" nohref>
</map>

#    shape="rect" coords="A,A',B,B'"
          (A,A')=Superior Izquierda, (B,B')=Inferior Derecha
      shape="circle" coords="A,A',R'"
          (A,A')=Centro, R=Radio
      shape="poly" coords="A,A',B,B',C,C'..."
          (A,A'>=Primer Angulo, (B,B')=Segundo Angulo, ... 



<img src="mapimg.gif"
             usemap="#Cara">

<map name="Cara">

<!-- area sin enlace -->
   <area shape="circle" 
    nohref
    coords="80,100,20">

<!--Boton de TEXTO-->
   <area shape="rect"
    href="page.html" 
    coords="140,20,280,60">

<!--Boton de TRIANGULO-->
   <area shape="poly"
    href="image.html"
    coords="100,100,180,80,200,140">

<!--CARA-->
   <area shape="circle" 
    href="new.html" 
    coords="80,100,60">

</map>



Guía de Diseño en HTML | Guía de Hojas de Estilo
Documento | Página | Fuente (Letra) | Texto | Imagen | Formatos | Tabla | Marco | Objetos | XML
LISTA DE MARCAS HTML | Edición PDF

BACK TO NCD HOME
Network Communication Design - http://www.ncdesign.org/
 Copyright & Publishing 1994-2002 Network Communication Design msg@ncdesign.org
Derechos Reservados 1995-2006 por: Carlos J. Naranjo e-mail: <webmaster <ARROBA> orange-tech <PUNTO> net>