CODIGOS HTML

221 views

Published on

Diferentes etiquetas de los codigos HTML, como usarlas y ejemplos.

Published in: Devices & Hardware
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
221
On SlideShare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
4
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

CODIGOS HTML

  1. 1. CODIGOS HTML María José Guzmán Ponce 1.B 28/05/15 Prof. Azucena Cervantes
  2. 2. ¿Que es una tabla en código HTML? Las tablas son un poderosa herramienta a la hora de mostrar y relacionar cierto tipo de información. Aún cuando muchos sitios son construidos (por su naturaleza) sin usar una simple tabla, existen algunas ocasiones en que el valor de las tablas se vuelve escencial. El atributo <TABLE> genera la tabla,
  3. 3. ¿Que significa “tr”? <TR> es una especie de "salto" de fila dentro de la tabla. Indican el comienzo y fin de una fila. Ej:
  4. 4. ¿Que significa “td”? <TD> sirve para definir los campos presentes dentro de la tabla. He aquí cómo el diseño puede ser transformado en código y, por tanto, en una tabla propiamente dicha: <TABLE BORDER=1 WIDTH=300> <TD WIDTH=100> </TD> <TD WIDTH=100> </TD> <TD WIDTH=100> </TD> </TABLE>
  5. 5. ¿Como insertas un simple borde en tu tabla? Para insertar un borde de un tabla en una página de internet debes incluir el código que aparece a continuación. Este puede ser modificado: <table border=1><td>Aqui va el contenido de la tabla, texto, imágenes, etc.</td></table> El número uno se refiere al tamaño del borde de la tabla. Si aumentas el número el borde será mas grueso y si escribes 0 la tabla no mostrará borde alguno.
  6. 6. Codigo para insertar una tabla invisible El valor se interpreta en pixeles y no admite unidades. Si el valor es 0 o el atributo no esta presente, los navegadores no dibujan los bordes interiores o exteriores, haciéndolos invisibles. Usamos unicamente la etiqueta <table>
  7. 7. ¿Que es “colspan”? Indica el número de columnas que ocupará la celda. Por defecto ocupa una sola columna.
  8. 8. ¿Que es “rowspan”? Indica el número de filas que ocupará la celda. Por defecto ocupa una sola fila.
  9. 9. Codigo usando las 2 etiquetas anteriores
  10. 10. ¿Que es “cell padding”? Este atributo nos permite especificar la distancia entre el margen interior de la celda y su contenido. En el caso de este atributo, si su valor es en pixeles los cuatro bordes de la celda deberían estar a la distancia indicada del contenido. En cambio si el valor es un porcentaje, los bordes superior e inferior estarán separados a una distancia porcentual del valor disponible verticalmente y lo mismo para los bordes derecho e izquierdo que estarán separados al porcentaje indicado del espacio disponible horizontalmente.
  11. 11. ¿Que es “cell spacing”? Este atributo permite determinar o especificar la distancia entre las celdas y entre las celdas y el margen exterior de la tabla. El valor de este atributo se mide en pixeles y es válido para todas las celdas.
  12. 12. ¿Como insertas color de fondo en una celda de una tabla? Cada campo puede tener un color de fondo distinto de los otros.Ej: <TABLE WIDTH=300 HEIGHT=200> <TD width=100 BGCOLOR="red"> prueba </TD> <TD WIDTH=100 BGCOLOR="yellow"> prueba </TD> <TD WIDTH=100 BGCOLOR="gray"> prueba </TD> </TABLE
  13. 13. ¿Cómo insertas una imagen de fondo en una tabla? Cada campo puede tener un fondo distinto de los otros.Ej: <TABLE WIDTH=300 HEIGHT=230> <TD BACKGROUND="fondo15.jpg"> prueba </TD> <TD BACKGROUND="fondo26.jpg"> prueba </TD> <TD BACKGROUND="fondo61.jpg"> prueba </TD> </TABLE
  14. 14. ¿Cómo alineas el contenido de tu tabla? La colocación del texto dentro de los distintos campos <TD> de la tabla puede ser modificada de varias maneras. Ej: <TABLE WIDTH=300 HEIGHT=200> <TD width=100 ALIGN=RIGHT> prueba </TD> <TD WIDTH=100 ALIGN=CENTER> prueba </TD> <TD WIDTH=100 ALIGN=LEFT> prueba </TD> </TABLE>
  15. 15. HtmlQuick (2015) Recuperado el: 27/05/15 De: http://www.htmlquick.com/es/tutorials/tables.html HtmlPoint (2006) Recuperado el: 27/05/15 De:http://www.htmlpoint.com/guida/html_11.htm (2015) Recuperado el: 27/05/15 De: http://www.usabilidad.tv/tutoriales_html/colspan_y_rowspan.asp (2014) Recuperado el: 27/05/15 http://bobuu.blogspot.com/2010/09/83-html-tablas-atributos-cellspacing- y.html Recuperado el: 28/05/15 http://www.luisfcorodriguez.com/tablas.htm

×