Manejar tablas
2 participantes
naruto ninja :: tu pc :: Html
Página 1 de 1.
Manejar tablas
Las tablas son muy buenas en una página, ya que nos ayudan a dividir la página en distintos espacios y ahorrar el Vertical, ya que aprovechamos lo Horizontal de la página.
* Lo primero que hacemos es hacer la tabla:
<table>
<tr>
<td>Contenido</td>
</tr>
</table>
Este comando es igual a:
Contenido
* Ahora si queremos aplicar a esta tabla una columna, aplicamos entre los tags
<TR> y </TR> otro <td>Contenido</td>, el código nos queda algo así:
<table>
<tr>
<td>Contenido</td>
<td>Contenido</td>
</tr>
</table>
Y se vería algo así:
Contenido Contenido
* Ahora si en vez de aplicar una fila en vez de una columna aplicamos otro <TR> a los tags <table>, y en el código nos quedaría algo así:
<table>
<tr>
<td>Contenido</td>
</tr>
<tr>
<td>Contenido</td>
</tr>
</table>
Y este sería nuestro resultado:
Contenido
Contenido
Ahora si querés que tu tabla no tenga un efecto tan desnutrido le podemos agregar retoques(atributos) a la etiqueta <table>, acá te dejo algunos:
1. width="tamaño vertical"
2. height="tamaño vertical"
3. border="Número de tamaño del borde"
4. cellspacing="Número de tamaño del espacio entre celda"
5. cellpadding="Número de tamaño de relleno entre celdas"
6. align="Alineación, centro, izquierda o derecha"
Centro ---> Center
Izquierda ---> left
Derecha ---> right
7. class="estilo de CSS"
Para aplicar esto en la etiqueta tabla, y en la tabla se pone por ejemplo así:
<table aling="center">
También podemos personalizar nuestras celdas con este mismo método pero no son los mismos códigos...
Por ejemplo no tenemos para agregar a <td>, cellspacing=""
Pero a <TD> y a <TR> podemos añadirle tamaño vertical y tamaño horizontal aunque no es lo mismo....bueno para solucionar eso puedes implementar más tablas...
Para que crear una tabla así:
--------------------------------------------------------CELDA1---------------------------
----------------------------CELDA2------- ----CELDA3------
Tenemos que poner el atributo colspan="" a la primero celda y borrar el código de la segunda así::
<table>
<tr>
<td colspan="2"></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
</table>
el número que contenga colspan="" es el número de las celdas de la fila que va a ocupar, también funciona con las columnas, nada mas que con <tr>
Saludos
* Lo primero que hacemos es hacer la tabla:
<table>
<tr>
<td>Contenido</td>
</tr>
</table>
Este comando es igual a:
Contenido
* Ahora si queremos aplicar a esta tabla una columna, aplicamos entre los tags
<TR> y </TR> otro <td>Contenido</td>, el código nos queda algo así:
<table>
<tr>
<td>Contenido</td>
<td>Contenido</td>
</tr>
</table>
Y se vería algo así:
Contenido Contenido
* Ahora si en vez de aplicar una fila en vez de una columna aplicamos otro <TR> a los tags <table>, y en el código nos quedaría algo así:
<table>
<tr>
<td>Contenido</td>
</tr>
<tr>
<td>Contenido</td>
</tr>
</table>
Y este sería nuestro resultado:
Contenido
Contenido
Ahora si querés que tu tabla no tenga un efecto tan desnutrido le podemos agregar retoques(atributos) a la etiqueta <table>, acá te dejo algunos:
1. width="tamaño vertical"
2. height="tamaño vertical"
3. border="Número de tamaño del borde"
4. cellspacing="Número de tamaño del espacio entre celda"
5. cellpadding="Número de tamaño de relleno entre celdas"
6. align="Alineación, centro, izquierda o derecha"
Centro ---> Center
Izquierda ---> left
Derecha ---> right
7. class="estilo de CSS"
Para aplicar esto en la etiqueta tabla, y en la tabla se pone por ejemplo así:
<table aling="center">
También podemos personalizar nuestras celdas con este mismo método pero no son los mismos códigos...
Por ejemplo no tenemos para agregar a <td>, cellspacing=""
Pero a <TD> y a <TR> podemos añadirle tamaño vertical y tamaño horizontal aunque no es lo mismo....bueno para solucionar eso puedes implementar más tablas...
Para que crear una tabla así:
--------------------------------------------------------CELDA1---------------------------
----------------------------CELDA2------- ----CELDA3------
Tenemos que poner el atributo colspan="" a la primero celda y borrar el código de la segunda así::
<table>
<tr>
<td colspan="2"></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
</table>
el número que contenga colspan="" es el número de las celdas de la fila que va a ocupar, también funciona con las columnas, nada mas que con <tr>
Saludos
netrox- estudiante de la academia
- Cantidad de envíos : 13
Edad : 34
barra de respeto :
Fecha de inscripción : 27/07/2008
naruto ninja :: tu pc :: Html
Página 1 de 1.
Permisos de este foro:
No puedes responder a temas en este foro.