HTML imagenes y tablas


En el post anterior “html continuacion” terminamos de ver como manejar textos y darles formato, ahora en este post comenzaremos a trabajar con otros elementos.

IMAGENES

Imagen de fondo

Para colocar una imagen de fondo haremos uso de el atributo background de la etiqueta <body>, solo hay que darle como valor el nombre completo de la imagen con su extension.

Si la imagen es mas grande que tu pantalla, entonces no se vera completa, pero si es mas pequeña, aparecera repetida tantas veces como sea necesario para cubrir el fondo completo.

En este punto cabe señalar que la imagen que se esta usando esta en la misma carpeta que el archivo html, si no fuera asi, se deberia  incluir la direccion del archivo.

Insertar imagenes

Para insertar una imagen en cualquier otro lado usaremos la etiqueta <img>. Esta etiqueta no posee etiqueta de cierre pero si necesita que definamos los siguientes atributos

  • src : en este atributo colocaremos el nombre del archivo de imagen entre comillas.
  • width : Con el controlamos el ancho de la imagen, en caso de que sea muy grande y queramos reducir su tamaño
  • heigth: con esta contralamos la altura de la imagen
  • border: permite agregar un borde a la imagen.

Si no quiere cambiar el tamaño de la imagen solo use el atributo src

En la imagen de ejemplo podemos ver que en el atributo src se ha colocado el nombre de una carpeta seguido de una diagonal y el nombre del archivo, esto se hace cuando la imagen esta dentro de una carpeta que esta al mismo nivel que el archivo html.

TABLAS

Para la creacion de tablas se utilizan 3 etiquetas: <table>, <tr>  y <td>.

<table>…</table>

Esta etiqueta declara el espacio dentro del cual se describira el contenido de la tabla, si no le especificamos el atributo border las lineas de la tabla no seran visibles, el valor del atributo border sera un numero entre 0 y x , donde 0 es sin borde.

<tr>…</tr>

De esta etiqueta se usara una por cada renglon de datos que deseemos tener y encerrara a un conjunto de etiquetas <td>

<td>…</td>

De esta etiqueta se colocara una por cada celda del renglon, en las tablas no se indica el numero de columnas debido a que el numero de etiquetas <td> en cada linea indica la cantidad de columnas de la tabla, es decir, si tenemos 3 etiquetas <td> por cada renglon de la tabla, tendremos una tabla de 3 columnas.

ANTERIOR: HTML continuación

SIGUIENTE: Formularios

Anuncios

Acerca de sistemasumma

Blog dedicado a la tecnología y a todos los estudiantes de sistemas, informatica, computación y afines
Esta entrada fue publicada en Lenguajes de aplicaciones y etiquetada , , . Guarda el enlace permanente.

2 respuestas a HTML imagenes y tablas

  1. Pingback: Formularios HTML « Ing. en sistemas de la UMMA

  2. Pingback: HTML continuacion « Ing. en sistemas de la UMMA

¿Qué estas pensando?

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s