.post-body:first-letter { float:left; color: #333333; font-size:100px; font-family:none; line-height:80px; padding-top:1px; padding-right:5px; } font-style: italic; } span.letracapital{ float: left; font-size: 40px; line-height: 35px; /* Dobla el alto de linea menos 1 pixel */ font-family: Georgia, "Times New Roman", Times, serif; color: #2583ad; /* Azul */ padding-right: 5px; } -->

Recent Posts

Poner imágenes en nuestra página

30 may 2016

Para poder poner imágenes en nuestra web o blog, solo tenemos que añadir unos atributos.


El tag básico para incluir una imagen en nuestra página es "img".
Este tag a diferencia de de la gran mayoría, no necesita cierre.
Siempre va acompañado de diferentes atributos.


El atributo "src" es fundamental para colocar una imagen ya que es el atributo que indica donde se encuentra alojada la imagen que queremos mostrar.
Por ejemplo:

"img src" ="x" 
En este caso la X correspondería a el link donde la imagen está ubicada.
También podemos alinearla tanto a la derecha, izquierda o centrarla.

"right" a la derecha
"bottom" abajo
"top" arriba
"middie" centrada

Además de todo esto podemos poner una descripción en las imagen dentro de la misma y que la gente pueda leerlo cuando mantenga en ratón encima de la misma.
"alt" realizaría esta función y se escribiría así:

"alt" ="x" 
En este caso la X correspondería a el texto que deseamos poner.
Debemos decir que no todos los navegadores nos permiten ver el atributo "alt" de manera visual.
Otros atributos son:
"Height"= Este atributo marca la altura de la imagen
"Widht"= Este atributo marca la anchura de la imagen.
Y por último también podemos dar el atributo de borde a la imagen como ya hemos comentado en otros post, con la etiqueta "border".
Aquí dejo el link donde explicamos los bordes
Aquí dejo un ejemplo:
 <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKtLWuQo_E-dSv5Lm31T4H6fs7ynKX92Wh2nX7nniziBs9Q1xnq85Z5lS6ul08G6RLPs6vTQ9L1R6x3Y8MYi3uwWoHxNPSDfjAV1JKrvnGbwyc2EsEzqoL_7-EpfmV7YsTKP8Squ84e_ch/s200/paraiso_1.jpeg" border="3" alt="Este es el ejemplo de un texto alternativo" width="400" height="300">
Aqui es donde escribirás tu texto

No hay comentarios:

Publicar un comentario

Deja tu comentario y en breve te contestaremos