Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Colegio nacional nicolas esguerra

187 views

Published on

web v

Published in: Education
  • Be the first to comment

  • Be the first to like this

Colegio nacional nicolas esguerra

  1. 1. COLEGIO NACIONAL NICOLAS ESGUERRA EDIFICAMOS FUTURO Andrés Felipe Gómez Lamprea Página web v Tabla <table> Las tablas están formadas porceldas,que son los recuadros que se obtienen como resultado de la intersección entre una fila y una columna. Fila <tr> Es necesario insertarlas etiquetas <tr> y </tr> porcada una de las filas de la tabla. Estas etiquetas deberán insertarse entre las etiquetas <table> y </table>. Por ejemplo,para crearuna tabla con cinco filas escribiríamos: <table> <tr>...</tr> <tr>...</tr> <tr>...</tr> <tr>...</tr> <tr>...</tr> </table>
  2. 2. Columna o celda <td> Para crearuna tabla no basta con especificarel número de filas, es necesario también especificarel número de columnas. <table border="1"> <tr> <td>Sábado</td> <td>Domingo</td> </tr> <tr> <td>Curso HTML</td> <td>Curso Dreamweaver</td> </tr> <tr> <td>Curso Frontpage</td> <td>Curso Flash</td> </tr> </table> Formato de la tabla Es posible modificar los siguientes atributos de una tabla: Por ejemplo,para modificar la tabla de la página anteriorpara que quedase como la siguiente: <table width="50%" border="2" align="center" cellspacing="0" bordercolor="#000000" b gcolor="#FFCC99"> ... </table>
  3. 3. Formato de las celdas Es posible modificar los siguientes atributos de una celda: También es posible modificar estos atributos de toda una fila, especificándolos en la etiqueta <tr>, en lugarde en la etiqueta <td>. <table width="50%" border="2" align="center" cellspacing="0" bordercolor="#000000" b gcolor="#FFCC99"> <tr align="center" bgcolor="#0099CC"> <td>sábado</td> <td bgcolor="#66CC99">Domingo</td> </tr> <tr> <td>Curso HTML</td> <td>Curso Dreamweaver</td> </tr> <tr> <td>Curso Frontpage</td> <td>Curso Flash</td> </tr> </table>
  4. 4. Encabezado de columna <th> Las etiquetas <td> y </td> se utilizan para definir las celdas de cada una de las filas, pero podemos poneren su lugarlas etiquetas <th> y </th>. <table width="50%" border="1" align="center"> <tr> <th>Sabado</td> <th>Domingo</td> </tr> <tr> <td>Curso HTML</td> <td>Curso Dreamweaver</td> </tr> <tr> <td>Curso Frontpage</td> <td>Curso Flash</td> </tr> </table> Título de tabla <caption> No solamente es posible establecertítulos para las columnas,también es posible establecerun título para la tabla mediante las etiquetas <caption> y </caption>. <table width="50%" border="1" align="center"> <caption align="right" valign="top">Titulo de la tabla<tr> <tr> <th>Sabado</td> ... </tr> </table>
  5. 5. Combinar celdas Para las etiquetas <td> y <th> existen los atributos colspan y rowspan,que se utilizan para combinarceldas. <table width="575" border="2" cellspacing="2"> <tr align="center" valign="middle"> <th colspan="4">DIFERENCIAS ENTRE EL PERRO Y EL HOMBRE</th> </tr> <tr align="center" valign="middle"> <th rowspan="2">DIFERENCIAS</th> <th colspan="2">PERRO</th> <th rowspan="2">HOMBRE</th> </tr> <tr align="center" valign="middle"> <th>PEQUE&Ntilde;O</th> <th>GRANDE</th> </tr> <tr align="center" valign="middle"> <td>Duraci&oacute;n crecimiento</td> <td>10 meses</td> <td>18 a 24 meses</td> <td>16 a&ntilde;os</td> </tr> <tr align="center" valign="middle"> <td>Tiempo de gestaci&oacute;n</td> <td colspan="2">58 a 63 d&iacute;as</td> <td>9 meses</td> </tr> <tr align="center" valign="middle"> <td>Duraci&oacute;n de vida del pelo/cabello</td> <td colspan="2">1 a&ntilde;o</td> <td>2 a 7 a&ntilde;os</td> </tr> </table>

×