SlideShare una empresa de Scribd logo
1 de 6
COLEGIO NACIONAL NICOLAS ESGUERRA
Edificamos futuro
PAGINA WEB V
El texto
DANIEL RODRIGUEZ MAYA
WILLIAM RONDON MUÑOZ
905
TABLA <TABLE>
Las tablas están formadas por celdas, que son los recuadros quese obtienen
como resultado de la intersección entre una fila y una columna.
FILA <TR>
Es necesario insertar las etiquetas <tr> y </tr> por cada una de las filas de la
tabla. Estas etiquetas deberán insertarseentre las etiqetas <table> y
</table>.
COLUMNA O CELDA <TD>
ara crear una tabla no basta con especificar el número de filas, es necesario
también especificar el número de columnas.
Una celda es el resultado de la intersección entre una fila y una columna, por
lo que podremos especificar el número de celdas por fila, que equivale a
especificar el número de columnas por fila.
Es necesario insertar las etiquetas <td> y </td> por cada una de las celdas
que compongan cada una de las filas de la tabla. Por lo tanto, habrá que
insertar esas etiquetas entre las etiquetas <tr> y </tr>.
FORMATO DE LA TABLA
Es posible modificar los siguientes atributos de una tabla:
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 lugar de en la etiqueta <td>.
Hay que tener en cuenta que los atributos tienen más prioridad cuando son
establecidos para una celda que cuando son establecidos para una fila
completa. Al mismo tiempo, tienen más prioridad los atributos establecidos
para una fila que los establecidos para toda la tabla.
ENCABEZADO DE COLUMNA <TH>
Las etiquetas <td> y </td> se utilizan para definir las celdas de cada una de
las filas, pero podemos poner en su lugar las etiquetas <th> y </th>.
Para la etiqueta <th> es posibleespecificar los mismos atributos que para la
etiqueta <td>, pero esta nueva etiqueta hace que el texto de la celda
aparezcacentrado y en negrita, por lo que se utiliza para definir los
encabezados o títulos de las columnas.
TÍTULO DE TABLA <CAPTION>
No solamente es posible establecer títulos para las columnas, también es
posible establecer un título para la tabla mediante las etiquetas <caption> y
</caption>.
Estas etiquetas han de ir después de la etiqueta <table>, y puede
especificarseel valor de los atributos align (con los valores bottom, center,
left, right y top) y valign (con los valores bottom y top).
COMBINAR CELDAS
las etiquetas <td> y <th> existen los atributos colspan y rowspan, quese
utilizan para combinar celdas.
A través del atributo colspan se especificael número de columnas por las que
se extenderá la celda, y a través del atributo rowspan seespecifica el número
de filas por las que se extenderá la celda.
Para que quede más claro, vamos a ver un ejemplo de su uso. Por ejemplo,
para insertar la siguiente tabla:
RESULTADO:
CODIGO:
<HTML>
<HEAD>
<!--PAGINA WEBELABORADA PORDANIEL RODRIGUEZ MAYA Y WILLIAM RONDON MUÑOZ 905 //-
->
<TITLE>GAMESHOP 905</TITLE>
<BODY BGCOLOR="YELLOW">
<HR>
<marquee bgcolor="RED"behavior="alternate"direction="right"><h1>BIENVENIDOSA NUESTRA
WEB<BR></h1></MARQUEE>
<HR>
<fontcolor="RED" size="7"face=" Arial SANSMS">GAMESHOP</font>
<p>
NUESTRA EMPRESA LLEVA 15 AÑOSDE EXPERIENCIA BRINDANDOAPORTESEN SISTEMASDE
TEGNOLOGIA,ENTRETENIMIENTOY VIDEOJUEGOS
</p>
<img src="imagenes/game.png"alt="game"border="3" width="300"height="150">
<img src="imagenes/xbox.jpg"alt="game"border="3" width="300"height="150">
<img src="imagenes/ps.jpg"alt="game"border="3" width="300"height="150">
<img src="imagenes/nintendo.jpg"alt="game"border="3" width="300"height="150">
<hr align="center"width="50%"size="5"color="990000" noshade>
<PRE>
<table width="50%"border="3"align="center"cellspacing="0"bordercolor="black"
bgcolor="YELLOW">
<tr align="center"bgcolor="#0099CC">
<td>PRODUCTO</td>
<td bgcolor="#0099CC">DESCRIPCION</td>
<td bgcolor="#0099CC">GALERIA</td>
</tr>
<tr>
<td>GEARS OF WAR</td>
<td>Es unvideojuegode disparosentercerapersona,del géneroacción-aventura,desarrollado
por Epic Games</td>
<td><img src="imagenes/gears.jpg"alt="game"border="3" width="75"height="90"></td>
</tr>
<tr>
<td>GOD OF WAR</td>
<td>Es unvideojuegode acción-aventuradesarrolladoporSCESantaMonica Studio</td>
<td><img src="imagenes/god.jpg"alt="game"border="3" width="75"height="90"></td>
</tr>
</table>
COPYRIGHT2015
COLEGIO NACIONALNICOLASESGUERRA
CALLE 6 85 - 35 BOGOTA - COLOMBIA
</PRE>
</BODY>
</HTML>

Más contenido relacionado

La actualidad más candente (17)

Tablas
TablasTablas
Tablas
 
Pagina WEB (V)
Pagina WEB (V)Pagina WEB (V)
Pagina WEB (V)
 
Trabajo de cely word
Trabajo de cely wordTrabajo de cely word
Trabajo de cely word
 
Unidad #3
Unidad #3Unidad #3
Unidad #3
 
Pagina web v
Pagina web vPagina web v
Pagina web v
 
CODIGOS HTML
CODIGOS HTMLCODIGOS HTML
CODIGOS HTML
 
Pendejobnolll
PendejobnolllPendejobnolll
Pendejobnolll
 
Diapositivas Html
Diapositivas HtmlDiapositivas Html
Diapositivas Html
 
Tablas html
Tablas htmlTablas html
Tablas html
 
Diapositivashtml 091118065750 Phpapp02
Diapositivashtml 091118065750 Phpapp02Diapositivashtml 091118065750 Phpapp02
Diapositivashtml 091118065750 Phpapp02
 
Tablas En Html
Tablas En HtmlTablas En Html
Tablas En Html
 
Html trabajo 5 informatica 904
Html trabajo 5 informatica 904Html trabajo 5 informatica 904
Html trabajo 5 informatica 904
 
Tablas
TablasTablas
Tablas
 
S.p.m6
S.p.m6S.p.m6
S.p.m6
 
Riveras
RiverasRiveras
Riveras
 
comidas
comidas comidas
comidas
 
4
44
4
 

Similar a Colegio nacional nicolas esguerra (20)

Portada
PortadaPortada
Portada
 
Tablas
Tablas Tablas
Tablas
 
Tablas
TablasTablas
Tablas
 
Tablas
TablasTablas
Tablas
 
Pagina web 5
Pagina web 5Pagina web 5
Pagina web 5
 
Red
RedRed
Red
 
Red
RedRed
Red
 
Pagina web 5
Pagina web 5Pagina web 5
Pagina web 5
 
Pagina web 5
Pagina web 5Pagina web 5
Pagina web 5
 
Bbn
BbnBbn
Bbn
 
Trabajo 3
Trabajo 3Trabajo 3
Trabajo 3
 
Taller5
Taller5Taller5
Taller5
 
Peres el yisus
Peres el yisusPeres el yisus
Peres el yisus
 
Penenope
PenenopePenenope
Penenope
 
Ddd
DddDdd
Ddd
 
Pagina web v
Pagina web vPagina web v
Pagina web v
 
Colegio nacional nicoles esguerra
Colegio nacional nicoles esguerraColegio nacional nicoles esguerra
Colegio nacional nicoles esguerra
 
Trabajo 6
Trabajo 6Trabajo 6
Trabajo 6
 
tablas
tablastablas
tablas
 
Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerraColegio nacional nicolas esguerra
Colegio nacional nicolas esguerra
 

Más de William Rondon Oz (20)

Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerraColegio nacional nicolas esguerra
Colegio nacional nicolas esguerra
 
Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerraColegio nacional nicolas esguerra
Colegio nacional nicolas esguerra
 
Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerraColegio nacional nicolas esguerra
Colegio nacional nicolas esguerra
 
Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerraColegio nacional nicolas esguerra
Colegio nacional nicolas esguerra
 
Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerraColegio nacional nicolas esguerra
Colegio nacional nicolas esguerra
 
Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerraColegio nacional nicolas esguerra
Colegio nacional nicolas esguerra
 
Evidencia base de datos
Evidencia base de datosEvidencia base de datos
Evidencia base de datos
 
Trabajo access 2010.
Trabajo access 2010.Trabajo access 2010.
Trabajo access 2010.
 
rerre
rerrererre
rerre
 
kfjgfjgfjju
kfjgfjgfjjukfjgfjgfjju
kfjgfjgfjju
 
Presentación1dsvsdvas
Presentación1dsvsdvasPresentación1dsvsdvas
Presentación1dsvsdvas
 
Rondonihjhm
RondonihjhmRondonihjhm
Rondonihjhm
 
Presentación2fzdsfd
Presentación2fzdsfdPresentación2fzdsfd
Presentación2fzdsfd
 
Presentación1
Presentación1Presentación1
Presentación1
 
Corrección epuvvc
Corrección epuvvcCorrección epuvvc
Corrección epuvvc
 
Corrección epufdfdfsaf
Corrección epufdfdfsafCorrección epufdfdfsaf
Corrección epufdfdfsaf
 
Colegio nacional nicolas esguerraKJH
Colegio nacional nicolas esguerraKJHColegio nacional nicolas esguerraKJH
Colegio nacional nicolas esguerraKJH
 
Presentación1
Presentación1Presentación1
Presentación1
 
Colegio nacional nicolas esguerrafhgbn
Colegio nacional nicolas esguerrafhgbnColegio nacional nicolas esguerrafhgbn
Colegio nacional nicolas esguerrafhgbn
 
Presentación1
Presentación1Presentación1
Presentación1
 

Último

Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...JohnRamos830530
 
Avances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvanaAvances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvanamcerpam
 
Innovaciones tecnologicas en el siglo 21
Innovaciones tecnologicas en el siglo 21Innovaciones tecnologicas en el siglo 21
Innovaciones tecnologicas en el siglo 21mariacbr99
 
How to use Redis with MuleSoft. A quick start presentation.
How to use Redis with MuleSoft. A quick start presentation.How to use Redis with MuleSoft. A quick start presentation.
How to use Redis with MuleSoft. A quick start presentation.FlorenciaCattelani
 
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptxEL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptxMiguelAtencio10
 
EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptx
EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptxEVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptx
EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptxJorgeParada26
 
Modulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdfModulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdfAnnimoUno1
 
Avances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estosAvances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estossgonzalezp1
 
pruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNITpruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNITMaricarmen Sánchez Ruiz
 
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdfRefrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdfvladimiroflores1
 
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptxPROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptxAlan779941
 

Último (11)

Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
 
Avances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvanaAvances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvana
 
Innovaciones tecnologicas en el siglo 21
Innovaciones tecnologicas en el siglo 21Innovaciones tecnologicas en el siglo 21
Innovaciones tecnologicas en el siglo 21
 
How to use Redis with MuleSoft. A quick start presentation.
How to use Redis with MuleSoft. A quick start presentation.How to use Redis with MuleSoft. A quick start presentation.
How to use Redis with MuleSoft. A quick start presentation.
 
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptxEL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
 
EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptx
EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptxEVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptx
EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptx
 
Modulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdfModulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdf
 
Avances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estosAvances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estos
 
pruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNITpruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNIT
 
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdfRefrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
 
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptxPROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
 

Colegio nacional nicolas esguerra

  • 1. COLEGIO NACIONAL NICOLAS ESGUERRA Edificamos futuro PAGINA WEB V El texto DANIEL RODRIGUEZ MAYA WILLIAM RONDON MUÑOZ 905 TABLA <TABLE> Las tablas están formadas por celdas, que son los recuadros quese obtienen como resultado de la intersección entre una fila y una columna. FILA <TR> Es necesario insertar las etiquetas <tr> y </tr> por cada una de las filas de la tabla. Estas etiquetas deberán insertarseentre las etiqetas <table> y </table>.
  • 2. COLUMNA O CELDA <TD> ara crear una tabla no basta con especificar el número de filas, es necesario también especificar el número de columnas. Una celda es el resultado de la intersección entre una fila y una columna, por lo que podremos especificar el número de celdas por fila, que equivale a especificar el número de columnas por fila. Es necesario insertar las etiquetas <td> y </td> por cada una de las celdas que compongan cada una de las filas de la tabla. Por lo tanto, habrá que insertar esas etiquetas entre las etiquetas <tr> y </tr>. FORMATO DE LA TABLA Es posible modificar los siguientes atributos de una tabla:
  • 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 lugar de en la etiqueta <td>. Hay que tener en cuenta que los atributos tienen más prioridad cuando son establecidos para una celda que cuando son establecidos para una fila completa. Al mismo tiempo, tienen más prioridad los atributos establecidos para una fila que los establecidos para toda la tabla. ENCABEZADO DE COLUMNA <TH> Las etiquetas <td> y </td> se utilizan para definir las celdas de cada una de las filas, pero podemos poner en su lugar las etiquetas <th> y </th>. Para la etiqueta <th> es posibleespecificar los mismos atributos que para la etiqueta <td>, pero esta nueva etiqueta hace que el texto de la celda aparezcacentrado y en negrita, por lo que se utiliza para definir los encabezados o títulos de las columnas.
  • 4. TÍTULO DE TABLA <CAPTION> No solamente es posible establecer títulos para las columnas, también es posible establecer un título para la tabla mediante las etiquetas <caption> y </caption>. Estas etiquetas han de ir después de la etiqueta <table>, y puede especificarseel valor de los atributos align (con los valores bottom, center, left, right y top) y valign (con los valores bottom y top). COMBINAR CELDAS las etiquetas <td> y <th> existen los atributos colspan y rowspan, quese utilizan para combinar celdas. A través del atributo colspan se especificael número de columnas por las que se extenderá la celda, y a través del atributo rowspan seespecifica el número de filas por las que se extenderá la celda. Para que quede más claro, vamos a ver un ejemplo de su uso. Por ejemplo, para insertar la siguiente tabla:
  • 5. RESULTADO: CODIGO: <HTML> <HEAD> <!--PAGINA WEBELABORADA PORDANIEL RODRIGUEZ MAYA Y WILLIAM RONDON MUÑOZ 905 //- -> <TITLE>GAMESHOP 905</TITLE> <BODY BGCOLOR="YELLOW"> <HR> <marquee bgcolor="RED"behavior="alternate"direction="right"><h1>BIENVENIDOSA NUESTRA WEB<BR></h1></MARQUEE> <HR> <fontcolor="RED" size="7"face=" Arial SANSMS">GAMESHOP</font> <p> NUESTRA EMPRESA LLEVA 15 AÑOSDE EXPERIENCIA BRINDANDOAPORTESEN SISTEMASDE TEGNOLOGIA,ENTRETENIMIENTOY VIDEOJUEGOS </p> <img src="imagenes/game.png"alt="game"border="3" width="300"height="150">
  • 6. <img src="imagenes/xbox.jpg"alt="game"border="3" width="300"height="150"> <img src="imagenes/ps.jpg"alt="game"border="3" width="300"height="150"> <img src="imagenes/nintendo.jpg"alt="game"border="3" width="300"height="150"> <hr align="center"width="50%"size="5"color="990000" noshade> <PRE> <table width="50%"border="3"align="center"cellspacing="0"bordercolor="black" bgcolor="YELLOW"> <tr align="center"bgcolor="#0099CC"> <td>PRODUCTO</td> <td bgcolor="#0099CC">DESCRIPCION</td> <td bgcolor="#0099CC">GALERIA</td> </tr> <tr> <td>GEARS OF WAR</td> <td>Es unvideojuegode disparosentercerapersona,del géneroacción-aventura,desarrollado por Epic Games</td> <td><img src="imagenes/gears.jpg"alt="game"border="3" width="75"height="90"></td> </tr> <tr> <td>GOD OF WAR</td> <td>Es unvideojuegode acción-aventuradesarrolladoporSCESantaMonica Studio</td> <td><img src="imagenes/god.jpg"alt="game"border="3" width="75"height="90"></td> </tr> </table> COPYRIGHT2015 COLEGIO NACIONALNICOLASESGUERRA CALLE 6 85 - 35 BOGOTA - COLOMBIA </PRE> </BODY> </HTML>