SlideShare una empresa de Scribd logo
1 de 7
CLASE 5
TABLAS
Tabla<table>
Las tablasestán formadas por celdas, que son los recuadros
que se obtienen como resultado de la intersección entre
una fila y una columna.
imagen y texto
COLUM
NA
Texto dentro
de una celda
FILA CELDA
Fila <tr>
Es necesario insertar las etiquetas<tr> y </tr> por cada una
de las filasde la tabla. Estas etiquetasdeberán insertarse
entre las etiqetas <table> y </table>.
Columnao celda <td>
Para 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 equivalea especificar el número de
columnaspor fila.
Es necesario insertar las etiquetas<td> y </td> por cada una
de las celdasque compongan cada una de las filas de la
tabla. Por lo tanto, habrá que insertar esas etiquetasentre
las etiquetas<tr> y </tr>.
Formato de la tabla
Es posiblemodificarlos siguientes atributosde una tabla:
Atributo Significado Posibles valores
width ancho de la tabla
un número, acompañado de % cuando se
desee que sea en porcentaje
height altura de la tabla
un número, acompañado de % cuando se desee
que sea en porcentaje
cellpadding
espacio entre el contenido de las
celdas y el borde
un número
cellspacing espacio entre celdas un número
border grosor del borde un número
align
alineación de la tabla dentro de
la página
left (izquierda)
right (derecha)
center (centro)
bgcolor color de fondo número hexadecimal
background imagen de fondo número hexadecimal
bordercolor color del borde número hexadecimal
Formato de las celdas
Es posiblemodificarlos siguientes atributosde una celda:
Atributo Significado Posibles valores
width ancho de la tabla
un número, acompañado de % cuando se
desee que sea en porcentaje
height altura de la tabla
un número, acompañado de % cuando se desee
que sea en porcentaje
align
alineación horizontal del
contenido de la celda
left (izquierda)
right (derecha)
center (centro)
valign
alineación vertical del contenido
de la celda
baseline (línea de base)
bottom (inferior)
middle (medio)
top (superior)
bgcolor color de fondo número hexadecimal
background imagen de fondo número hexadecimal
bordercolor color del borde número hexadecimal
<table width="50%"border="2"align="center"cellspacing="0"bordercolor="#000000"
bgcolor="#FFCC99">
<tr align="center"bgcolor="#0099CC">
<td>Sabado</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>
CODIGO
<html>
<head>
<title>sportingoods903</title>
</head>
<imgsrc="imagenes/LOGOEMPRESA.jpg"alt="EMPRESA LOGOborder="5"
width="500" height="250">
<!--paginaweblaelaboromarlontellezymarco suarezdel grado903//-->.
<bodybgcolor="#2EFEF7">
<hr>
<MARQUEE><H2>MI PRIMERA PAGINA WEB</MARQUEE></H2> <br>
<hr>
<blockquote>
nuetracompañiaofrece:<br>
productosde alta calidadcon todolorelacionadoenel deporte
</blockquote>
<fontcolor="#BLACK"size="4"face="ComicSansMS"><B>PELOTA</B></font>
<fontcolor="#BLACK"size="4"face=" Arial"><I><B>DE TENNIS</I></B></font>
<H3><P ALIGN="CENTER"> Pelotade tenis.Utilizadaparalarealizacióndel deporte tenis;las
mismasdebentenerun
diámetrode 6.35 centímetrosymenorde 6.67, de coloramarillo,siendoesteel únicocolorque
puede utilizarse
acompañadocon blancopara mejorarla visualizaciónde losjugadoresytambiénde los
espectadoresportelevisión.
</P><H3>
<imgsrc="imagenes/logotenis.jpg"alt="TENISLOGOborder="15"width="300" height="250">
<img src="imagenes/pelotade teniss.jpg"alt="TENISPELOTA border="5"width="300"
height="250">
<HR>GUAYOS NIKE<HR/>
<H3><P ALIGN="CENTER"> CR Mercurial VaporSuperflyII.Descripción:ofrecenel innovador
sistemade tracción
adaptativaNike Sense,enel que losdiseñadorescrearonun tacointeligente que puede
extenderse yretraerse hasta
3mm, segúnlascondicionesdel pisoylapresiónejercidaporel jugador.
</P><H3>
<img src="imagenes/LOGONIKE.jpg"alt="NIKELOGOborder="5"width="300" height="250">
<img src="imagenes/GUAYOSNIKE.jpg"alt="NIKEguayosborder="5"width="300"
height="250">
<table width="50%"border="2"align="center"cellspacing="0"bordercolor="#BLACK"
bgcolor="#GREEN">
<tr align="center"bgcolor="#BLACK">
<td>PRODUCTO</td>
<td bgcolor="#BLUE">PRECIO</td>
</tr>
<tr>
<td>PELOTA DE TENNIS</td>
<td>20.000</td>
</tr>
<tr>
<td>GUAYOS NIKE</td>
<td>260.000</td>
</tr>
</table>
<fontcolor="#993366" size="4"face="ComicSansMS,">addidas,nike colombia </font>
<hr align="center"width="50%"size="5"noshade>
<pre> copyright2015@
sportinggoods
calle 42 N° 78 - 43 bogotacolombia
sporting.goods@gmail.com
</pre>
</body>
</html

Más contenido relacionado

La actualidad más candente (18)

Pagina web v
Pagina web vPagina web v
Pagina web v
 
ARCHIVO ADJUNTO
ARCHIVO ADJUNTOARCHIVO ADJUNTO
ARCHIVO ADJUNTO
 
Tablas
TablasTablas
Tablas
 
Trabajo hoy :3
Trabajo hoy :3Trabajo hoy :3
Trabajo hoy :3
 
Exel
ExelExel
Exel
 
Pagina web v
Pagina web vPagina web v
Pagina web v
 
Tablas dinamicas-pdf
Tablas dinamicas-pdfTablas dinamicas-pdf
Tablas dinamicas-pdf
 
Diseño de formatos
Diseño de formatosDiseño de formatos
Diseño de formatos
 
TRABAJO 2
TRABAJO 2TRABAJO 2
TRABAJO 2
 
Web3
Web3Web3
Web3
 
S.p.m6
S.p.m6S.p.m6
S.p.m6
 
FORMATO DE CELDA EN EXCEL
FORMATO DE CELDA EN EXCELFORMATO DE CELDA EN EXCEL
FORMATO DE CELDA EN EXCEL
 
Excel
ExcelExcel
Excel
 
Tablas html
Tablas htmlTablas html
Tablas html
 
comidas
comidas comidas
comidas
 
Pagina web 5
Pagina web 5Pagina web 5
Pagina web 5
 
Peres el yisus
Peres el yisusPeres el yisus
Peres el yisus
 
Opciones de autorelleno
Opciones de autorellenoOpciones de autorelleno
Opciones de autorelleno
 

Destacado (20)

Pagina web clase 3
Pagina web clase 3Pagina web clase 3
Pagina web clase 3
 
Pagina web 4
Pagina web 4Pagina web 4
Pagina web 4
 
Primera clase pagina web
Primera clase pagina webPrimera clase pagina web
Primera clase pagina web
 
Muestras 06
Muestras 06Muestras 06
Muestras 06
 
Segunda clase pagina web
Segunda clase pagina webSegunda clase pagina web
Segunda clase pagina web
 
Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerraColegio nacional nicolas esguerra
Colegio nacional nicolas esguerra
 
Marcos
MarcosMarcos
Marcos
 
Actividad 1
Actividad 1Actividad 1
Actividad 1
 
Portada
PortadaPortada
Portada
 
Actividad 2 sensores y aplicacion
Actividad 2 sensores y aplicacionActividad 2 sensores y aplicacion
Actividad 2 sensores y aplicacion
 
Tabla903
Tabla903Tabla903
Tabla903
 
Facturas903 (1)
Facturas903 (1)Facturas903 (1)
Facturas903 (1)
 
Actividad 3 ntx
Actividad 3 ntxActividad 3 ntx
Actividad 3 ntx
 
Sportin goods 25
Sportin goods 25Sportin goods 25
Sportin goods 25
 
Base de datos marlon (1) 25
Base de datos marlon (1) 25Base de datos marlon (1) 25
Base de datos marlon (1) 25
 
Activiad 2 periodo
Activiad 2 periodoActiviad 2 periodo
Activiad 2 periodo
 
Consultas en access 25
Consultas en access 25Consultas en access 25
Consultas en access 25
 
Mapa903
Mapa903Mapa903
Mapa903
 
Actividad 2 sensores y aplicacion (1) 2 periodo
Actividad 2 sensores y aplicacion (1) 2 periodoActividad 2 sensores y aplicacion (1) 2 periodo
Actividad 2 sensores y aplicacion (1) 2 periodo
 
Colegio nacional nicolas esguerra1
Colegio nacional nicolas esguerra1Colegio nacional nicolas esguerra1
Colegio nacional nicolas esguerra1
 

Similar a Clase 5 (20)

Clases tablas html
Clases tablas htmlClases tablas html
Clases tablas html
 
Clases tablas html
Clases tablas htmlClases tablas html
Clases tablas html
 
Clases tablas html
Clases tablas htmlClases tablas html
Clases tablas html
 
Clases tablas html
Clases tablas htmlClases tablas html
Clases tablas html
 
tablas
tablastablas
tablas
 
Clases tablas html
Clases tablas htmlClases tablas html
Clases tablas html
 
Clases tablas html
Clases tablas htmlClases tablas html
Clases tablas html
 
Html 5
Html 5Html 5
Html 5
 
TABLAS HTML
TABLAS HTMLTABLAS HTML
TABLAS HTML
 
Web 5
Web 5Web 5
Web 5
 
Colegio nacional nicoles esguerra
Colegio nacional nicoles esguerraColegio nacional nicoles esguerra
Colegio nacional nicoles esguerra
 
Trabajo tablas
Trabajo tablasTrabajo tablas
Trabajo tablas
 
Wilson8
Wilson8Wilson8
Wilson8
 
Tu papa
Tu papaTu papa
Tu papa
 
Pagina v
Pagina vPagina v
Pagina v
 
Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerraColegio nacional nicolas esguerra
Colegio nacional nicolas esguerra
 
Tablas
Tablas Tablas
Tablas
 
Tablas html
Tablas htmlTablas html
Tablas html
 
Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerraColegio nacional nicolas esguerra
Colegio nacional nicolas esguerra
 
Pendejobnolll
PendejobnolllPendejobnolll
Pendejobnolll
 

Más de marlontellez14

Más de marlontellez14 (20)

Clase 6 pagina web 2
Clase 6 pagina web 2Clase 6 pagina web 2
Clase 6 pagina web 2
 
Clase 5
Clase 5Clase 5
Clase 5
 
Pagina web 3
Pagina web 3Pagina web 3
Pagina web 3
 
Pagina web clase 2
Pagina web clase 2Pagina web clase 2
Pagina web clase 2
 
Clase 1 muestras
Clase 1 muestrasClase 1 muestras
Clase 1 muestras
 
trabajo base de datos 3 periodo definitivo
trabajo base de datos 3 periodo definitivo trabajo base de datos 3 periodo definitivo
trabajo base de datos 3 periodo definitivo
 
Muestras base de datos
Muestras base de datosMuestras base de datos
Muestras base de datos
 
trabajo informatica base de datos
trabajo informatica base de datos trabajo informatica base de datos
trabajo informatica base de datos
 
Trabajo informatica 2015 (1)
Trabajo informatica 2015 (1)Trabajo informatica 2015 (1)
Trabajo informatica 2015 (1)
 
Consultas en access
Consultas en accessConsultas en access
Consultas en access
 
Trabajo informatica 2015 (1)
Trabajo informatica 2015 (1)Trabajo informatica 2015 (1)
Trabajo informatica 2015 (1)
 
Base de datos marlon 3
Base de datos marlon 3Base de datos marlon 3
Base de datos marlon 3
 
Sporting goods
Sporting goodsSporting goods
Sporting goods
 
Base de datos marlon (1)
Base de datos marlon (1)Base de datos marlon (1)
Base de datos marlon (1)
 
Sporting goods
Sporting goodsSporting goods
Sporting goods
 
Base de datos marlon (1)
Base de datos marlon (1)Base de datos marlon (1)
Base de datos marlon (1)
 
Sporting goods
Sporting goodsSporting goods
Sporting goods
 
Sporting goods
Sporting goodsSporting goods
Sporting goods
 
Actividad 3 ntx
Actividad 3 ntxActividad 3 ntx
Actividad 3 ntx
 
Actividad 2 sensores y aplicacion
Actividad 2 sensores y aplicacionActividad 2 sensores y aplicacion
Actividad 2 sensores y aplicacion
 

Último

RESOLUCIÓN VICEMINISTERIAL 00048 - 2024 EVALUACION
RESOLUCIÓN VICEMINISTERIAL 00048 - 2024 EVALUACIONRESOLUCIÓN VICEMINISTERIAL 00048 - 2024 EVALUACION
RESOLUCIÓN VICEMINISTERIAL 00048 - 2024 EVALUACION
amelia poma
 

Último (20)

Interpretación de cortes geológicos 2024
Interpretación de cortes geológicos 2024Interpretación de cortes geológicos 2024
Interpretación de cortes geológicos 2024
 
Desarrollo y Aplicación de la Administración por Valores
Desarrollo y Aplicación de la Administración por ValoresDesarrollo y Aplicación de la Administración por Valores
Desarrollo y Aplicación de la Administración por Valores
 
AEC 2. Aventura en el Antiguo Egipto.pptx
AEC 2. Aventura en el Antiguo Egipto.pptxAEC 2. Aventura en el Antiguo Egipto.pptx
AEC 2. Aventura en el Antiguo Egipto.pptx
 
RESOLUCIÓN VICEMINISTERIAL 00048 - 2024 EVALUACION
RESOLUCIÓN VICEMINISTERIAL 00048 - 2024 EVALUACIONRESOLUCIÓN VICEMINISTERIAL 00048 - 2024 EVALUACION
RESOLUCIÓN VICEMINISTERIAL 00048 - 2024 EVALUACION
 
1ro Programación Anual D.P.C.C planificación anual del área para el desarroll...
1ro Programación Anual D.P.C.C planificación anual del área para el desarroll...1ro Programación Anual D.P.C.C planificación anual del área para el desarroll...
1ro Programación Anual D.P.C.C planificación anual del área para el desarroll...
 
Biografía de Charles Coulomb física .pdf
Biografía de Charles Coulomb física .pdfBiografía de Charles Coulomb física .pdf
Biografía de Charles Coulomb física .pdf
 
LA LITERATURA DEL BARROCO 2023-2024pptx.pptx
LA LITERATURA DEL BARROCO 2023-2024pptx.pptxLA LITERATURA DEL BARROCO 2023-2024pptx.pptx
LA LITERATURA DEL BARROCO 2023-2024pptx.pptx
 
prostitución en España: una mirada integral!
prostitución en España: una mirada integral!prostitución en España: una mirada integral!
prostitución en España: una mirada integral!
 
Tema 17. Biología de los microorganismos 2024
Tema 17. Biología de los microorganismos 2024Tema 17. Biología de los microorganismos 2024
Tema 17. Biología de los microorganismos 2024
 
Louis Jean François Lagrenée. Erotismo y sensualidad. El erotismo en la Hist...
Louis Jean François Lagrenée.  Erotismo y sensualidad. El erotismo en la Hist...Louis Jean François Lagrenée.  Erotismo y sensualidad. El erotismo en la Hist...
Louis Jean François Lagrenée. Erotismo y sensualidad. El erotismo en la Hist...
 
Código Civil de la República Bolivariana de Venezuela
Código Civil de la República Bolivariana de VenezuelaCódigo Civil de la República Bolivariana de Venezuela
Código Civil de la República Bolivariana de Venezuela
 
La Sostenibilidad Corporativa. Administración Ambiental
La Sostenibilidad Corporativa. Administración AmbientalLa Sostenibilidad Corporativa. Administración Ambiental
La Sostenibilidad Corporativa. Administración Ambiental
 
Sesión de clase APC: Los dos testigos.pdf
Sesión de clase APC: Los dos testigos.pdfSesión de clase APC: Los dos testigos.pdf
Sesión de clase APC: Los dos testigos.pdf
 
Lecciones 06 Esc. Sabática. Los dos testigos
Lecciones 06 Esc. Sabática. Los dos testigosLecciones 06 Esc. Sabática. Los dos testigos
Lecciones 06 Esc. Sabática. Los dos testigos
 
Actividades para el 11 de Mayo día del himno.docx
Actividades para el 11 de Mayo día del himno.docxActividades para el 11 de Mayo día del himno.docx
Actividades para el 11 de Mayo día del himno.docx
 
Prueba libre de Geografía para obtención título Bachillerato - 2024
Prueba libre de Geografía para obtención título Bachillerato - 2024Prueba libre de Geografía para obtención título Bachillerato - 2024
Prueba libre de Geografía para obtención título Bachillerato - 2024
 
Tema 11. Dinámica de la hidrosfera 2024
Tema 11.  Dinámica de la hidrosfera 2024Tema 11.  Dinámica de la hidrosfera 2024
Tema 11. Dinámica de la hidrosfera 2024
 
Plan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdf
Plan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdfPlan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdf
Plan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdf
 
Usos y desusos de la inteligencia artificial en revistas científicas
Usos y desusos de la inteligencia artificial en revistas científicasUsos y desusos de la inteligencia artificial en revistas científicas
Usos y desusos de la inteligencia artificial en revistas científicas
 
PLAN DE REFUERZO ESCOLAR MERC 2024-2.docx
PLAN DE REFUERZO ESCOLAR MERC 2024-2.docxPLAN DE REFUERZO ESCOLAR MERC 2024-2.docx
PLAN DE REFUERZO ESCOLAR MERC 2024-2.docx
 

Clase 5

  • 1. CLASE 5 TABLAS Tabla<table> Las tablasestán formadas por celdas, que son los recuadros que se obtienen como resultado de la intersección entre una fila y una columna. imagen y texto COLUM NA Texto dentro de una celda FILA CELDA
  • 2. Fila <tr> Es necesario insertar las etiquetas<tr> y </tr> por cada una de las filasde la tabla. Estas etiquetasdeberán insertarse entre las etiqetas <table> y </table>. Columnao celda <td> Para 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 equivalea especificar el número de columnaspor fila. Es necesario insertar las etiquetas<td> y </td> por cada una de las celdasque compongan cada una de las filas de la tabla. Por lo tanto, habrá que insertar esas etiquetasentre las etiquetas<tr> y </tr>. Formato de la tabla Es posiblemodificarlos siguientes atributosde una tabla: Atributo Significado Posibles valores
  • 3. width ancho de la tabla un número, acompañado de % cuando se desee que sea en porcentaje height altura de la tabla un número, acompañado de % cuando se desee que sea en porcentaje cellpadding espacio entre el contenido de las celdas y el borde un número cellspacing espacio entre celdas un número border grosor del borde un número align alineación de la tabla dentro de la página left (izquierda) right (derecha) center (centro) bgcolor color de fondo número hexadecimal background imagen de fondo número hexadecimal bordercolor color del borde número hexadecimal Formato de las celdas Es posiblemodificarlos siguientes atributosde una celda: Atributo Significado Posibles valores width ancho de la tabla un número, acompañado de % cuando se desee que sea en porcentaje height altura de la tabla un número, acompañado de % cuando se desee que sea en porcentaje align alineación horizontal del contenido de la celda left (izquierda) right (derecha) center (centro) valign alineación vertical del contenido de la celda baseline (línea de base) bottom (inferior) middle (medio) top (superior) bgcolor color de fondo número hexadecimal background imagen de fondo número hexadecimal bordercolor color del borde número hexadecimal
  • 4. <table width="50%"border="2"align="center"cellspacing="0"bordercolor="#000000" bgcolor="#FFCC99"> <tr align="center"bgcolor="#0099CC"> <td>Sabado</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> CODIGO <html> <head> <title>sportingoods903</title> </head> <imgsrc="imagenes/LOGOEMPRESA.jpg"alt="EMPRESA LOGOborder="5" width="500" height="250"> <!--paginaweblaelaboromarlontellezymarco suarezdel grado903//-->. <bodybgcolor="#2EFEF7"> <hr>
  • 5. <MARQUEE><H2>MI PRIMERA PAGINA WEB</MARQUEE></H2> <br> <hr> <blockquote> nuetracompañiaofrece:<br> productosde alta calidadcon todolorelacionadoenel deporte </blockquote> <fontcolor="#BLACK"size="4"face="ComicSansMS"><B>PELOTA</B></font> <fontcolor="#BLACK"size="4"face=" Arial"><I><B>DE TENNIS</I></B></font> <H3><P ALIGN="CENTER"> Pelotade tenis.Utilizadaparalarealizacióndel deporte tenis;las mismasdebentenerun diámetrode 6.35 centímetrosymenorde 6.67, de coloramarillo,siendoesteel únicocolorque puede utilizarse acompañadocon blancopara mejorarla visualizaciónde losjugadoresytambiénde los espectadoresportelevisión. </P><H3> <imgsrc="imagenes/logotenis.jpg"alt="TENISLOGOborder="15"width="300" height="250"> <img src="imagenes/pelotade teniss.jpg"alt="TENISPELOTA border="5"width="300" height="250"> <HR>GUAYOS NIKE<HR/> <H3><P ALIGN="CENTER"> CR Mercurial VaporSuperflyII.Descripción:ofrecenel innovador sistemade tracción adaptativaNike Sense,enel que losdiseñadorescrearonun tacointeligente que puede extenderse yretraerse hasta 3mm, segúnlascondicionesdel pisoylapresiónejercidaporel jugador.
  • 6. </P><H3> <img src="imagenes/LOGONIKE.jpg"alt="NIKELOGOborder="5"width="300" height="250"> <img src="imagenes/GUAYOSNIKE.jpg"alt="NIKEguayosborder="5"width="300" height="250"> <table width="50%"border="2"align="center"cellspacing="0"bordercolor="#BLACK" bgcolor="#GREEN"> <tr align="center"bgcolor="#BLACK"> <td>PRODUCTO</td> <td bgcolor="#BLUE">PRECIO</td> </tr> <tr> <td>PELOTA DE TENNIS</td> <td>20.000</td> </tr> <tr> <td>GUAYOS NIKE</td> <td>260.000</td> </tr> </table> <fontcolor="#993366" size="4"face="ComicSansMS,">addidas,nike colombia </font> <hr align="center"width="50%"size="5"noshade> <pre> copyright2015@ sportinggoods
  • 7. calle 42 N° 78 - 43 bogotacolombia sporting.goods@gmail.com </pre> </body> </html