Html [Imagenes]

Ver el tema anterior Ver el tema siguiente Ir abajo

Html [Imagenes]

Mensaje por Atsu el Dom Nov 08, 2015 7:46 pm



Atributos html en imagenes


Bueno aqui vamos con otra parte del tutorial, "¿como modificar las imagenes?" esto para que sepan como se modifica una imagen y como puede anexar una =D.

Como colocar una imagen en html¿?

Para empezar el codigo para colocar una imagen es el atributo y para colocar la imagen seria

Código:
<IMG SRC="URL DE LA IMAGEN" />
[Tienes que estar registrado y conectado para ver esa imagen]



Alineacion de imagenes


Para alinear una imagen solo se le debe agregar el atributo [aling=" alineacion"] ya sea left |center | right

Código:
<div align="left"><img src="imag.gif"></div>
[Tienes que estar registrado y conectado para ver esa imagen]

Código:

<div align="center"><img src="imag.gif"></div>

[Tienes que estar registrado y conectado para ver esa imagen]


Código:

<div align="right"><img src="imag.gif"></div>

[Tienes que estar registrado y conectado para ver esa imagen]




Alineacion de texto e imagenes

Para alinear una imagen y un texto a su izq o derecha usaremos el siguiente codigo
Código:

<p>
<img src="imagen.gif" align="right">texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto
</p>


[Tienes que estar registrado y conectado para ver esa imagen]texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto



Código:

<p>
<img src="imagen.gif" align="left">texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto
</p>


[Tienes que estar registrado y conectado para ver esa imagen]texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto





Atributo alt y Links

El atributo alt anexado a una imagen nos permite darle un titulo a esta, es decir es un texto alternativo de la imagen, al poner el cursor sobre esta aparece "alt" o un titulo

Código:
<img src="bishoujo png" alt="bishoujo forum">


Pon un segundo el cursor en la imagen

[Tienes que estar registrado y conectado para ver esa imagen]

Hacer que una imagen me lleve a un sitio [Atributo link]

Código:

<A HREF="http://bishoujo.nstars.org/" ><img src="http://i1158.photobucket.com/albums/p608/XxHawkeye/bishosis_zps9cb12a5e.png" > </A>


Pon el cursor un segundo en la imagen [ te daras cuenta que como no tiene alt no aparece nada]

[Tienes que estar registrado y conectado para ver este vínculo]

Hacer que una imagen me lleve a un sitio [Atributo link + alt]

Código:

<A HREF="http://bishoujo.nstars.org/" ><img src="http://i1158.photobucket.com/albums/p608/XxHawkeye/bishosis_zps9cb12a5e.png" alt="bishoujo forum"> </A>


Pon el cursor un segundo en la imagen [ esta imagen tiene un link y alt por lo tanto si aparece el texto encima de ella]

[Tienes que estar registrado y conectado para ver este vínculo]



tamaño

Para dar el tamaño que nosotros queremos simplemente anexamos los atributos Width y height donde
width = Anchura [anchor]
height = altura [largo]


Código:
   <img src="bishoujo png" width="200" height="80">
[Tienes que estar registrado y conectado para ver esa imagen]

Código:
   <img src="bishoujo png" width="500" height="100">
[Tienes que estar registrado y conectado para ver esa imagen]
avatar
Atsu
Admin

Mensajes : 40
Reputacion : 122
Reputación : 0
Fecha de inscripción : 08/11/2015

Ver perfil de usuario http://bestdesign.webservices.tv

Volver arriba Ir abajo

Ver el tema anterior Ver el tema siguiente Volver arriba

- Temas similares

 
Permisos de este foro:
No puedes responder a temas en este foro.