Al momento de trabajar con imágenes debemos de tomar en cuenta un aspecto muy importante, se trata del tamaño de las imágenes, ya que entre mas pesadas estén, mas demorara el navegador en mostrarlas, así que mejor utilicen imágenes livianas u optimicen la imagen para la web, hay bastantes herramientas online para lograr este objetivo.
Etiqueta ![]()
.-
Esta etiqueta nos sirve para insertar una imagen en un documento html, como veran, esta etiqueta es especial por que no cuenta con una etiqueta de cierre, en su lugar se utiliza un espacio en blanco seguido de una barra, es como una especie de etiqueta de cierre integrada.
Sintaxis básica.-
||
|| <img src="mi_imagen.jpg" title="Mi imagen" />
||
|| <img src="mi_imagen.jpg" title="Mi imagen" />
||
La etiqueta < img/> cuenta con los siguientes atributos.-
- Src .- Este es el mas importante de todos los atributos, ya que indica la ruta donde se encuentra la imagen a mostrar.
- Alt .- Con este atributo podemos ingresar un texto alternativo, el cual se aparecerá cuando la imagen no se muestre.
- Width .- Con este atributo le indicamos al navegador el ancho que deberá tener la imagen.
- Height .- Igual que el atributo anterior, solo que ahora se trata de la altura de la imagen.
- Title .- Este atributo es opcional, y muestra un texto informativo sobre la imagen cuando pasamos el ratón sobre esta.
ejemplo.-
||
|| < img src="imagen.jpg" whith="100" height="50" alt="Mi imagen" title="Esta es mi imagen" />
||
|| < img src="imagen.jpg" whith="100" height="50" alt="Mi imagen" title="Esta es mi imagen" />
||
0 responses to "Trabajando con imagenes en Html"