Post Actualizado en marzo 26, 2013


Aprende HTML en pocos pasos parte 2

Propiedades de imagenes: Continuamos con esta guia para insertar propiedades en las imagenes y sus codigos: Tamano de la imagen Codigo: <img src= “imagen.jpg” width:”100″ height: “100” /> Codigo de la imagen + nombre de la imagen + ancho + pixeles entre comillas + alto + pixeles entre comillas + cierre de las etiquetas. En […]

Propiedades de imagenes:

Continuamos con esta guia para insertar propiedades en las imagenes y sus codigos:

Tamano de la imagen Codigo:

<img src= “imagen.jpg” width:”100″ height: “100” />

Codigo de la imagen + nombre de la imagen + ancho + pixeles entre comillas + alto + pixeles entre comillas + cierre de las etiquetas.

En este caso las comillas sirven para especificar la cantidad de pixeles en ancho y alto y a su vez cierran la etiqueta, tiene una excepcion de cierre que no utiliza la diagonal /, esta se utiliza al final del codigo de imagen para cerrarla completamente.

Agreguemos borde y propiedades:

<img src= “magen.jpg” width: “100” height: “100” border-color: green; border-style: solid; border-width: 20px />

Notas: 

Estilos de borde:
Dotted: punteado
Dashed: con lineas
Solid: solido
Double: Doble

Px: pixeles

Alineacion en la imagen:

<img src= “magen.jpg” align: left/>

Margen:

<img src= “magen.jpg” margin-left: 30 px />

 

 

Ejemplo si quisieramos combinar todo:

<img src= "magen.jpg" width: "100" height: "100" border-color: green; border-style: solid; 
border-width: 20px; align: left; margin-left: 30 px />

Para separar las propiedades se utilizan punto y coma.
El codigo puede volverse extenso y se resumira en una imagen con muchas propiedades.