• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Tablas
 

Tablas

on

  • 1,552 views

 

Statistics

Views

Total Views
1,552
Views on SlideShare
1,552
Embed Views
0

Actions

Likes
0
Downloads
15
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Tablas Tablas Presentation Transcript

    • INTEGRANTES :ALMA KARLA MORALESHERRERAOLGA LILIANA SANCHEZJUAREZJORGE ALFREDO GÒMEZ GIL
    • Las tablas presentan una serie de datos deforma clara y organizada dividiéndolos enfilas y columnas además ofrece elementospara organizar contenidos y repartir elespacio.
    • Menú insertar, a la opción tabla; se tiene que especificar elnumero de filas y columnas, así como el ancho de la tabla.El ancho se puede definir por pixeles o porcentaje• GROSOR DEL BORDE: indica el grosor del borde de la tabla en pixeles por defecto se le asigna(1).• RELLENO DE CELDA:(cellpading)indica la distancia entre el contenido de las celdas y los bordes de estas• ESPACIO ENTRE CELDAS:(cellspancing) indica la diferencia entre las celdas de la tablaTambién se puede establecer un ENCABEZADO para latabla, ya sea para indicar el contenido de filas y columnas.
    • Para insertar texto o imágenes, simplemente hay quesituar el punto de inserción dentro de la celda deseadahaciendo clic.
    • SELECCIONAR ELEMENTOSDE UNA CELDA A través del menú MODIFICAR “estando en punto de inserción de la tabla", o desplegado “menú contextual; se pulsa el botón derecho sobre ella cuando se selecciona una tabla dreamweaver muestra una zona verde, el ancho de la tabla y de cada columna. • MENU DE ENCABEZADO DE TABLA • MENU DE ENCABEZADO DE LA COLUMNA.
    • Las propiedades de la tabla se especifican através de su inspector de propiedades. En estecaso, se crearán atributos para la tabla. Peroalgunos de estos valores, como el ancho, lospodemos especificar mediante CSS.
    • Como cualquier elemento, podemos cambiar elaspecto de la tabla definiendo propiedades CSS. Los selectores.Podemos definir una clase y aplicársela a la tabladesde el panel Propiedades, o si es una tabla enconcreto, asignarle un ID y definir las propiedadespara ese ID.Vemos que con el selector tabla nos referimos a latabla completa. Con el selector tr hacemosreferencia a las filas y con el selector td hacemosreferencia a las celdas. Cuando las celdas seanencabezados, en vez de td, emplearemos elselector th. Observa que no hay un selector parareferenciar a las columnas enteras, aunque síexiste un método
    • PropiedadesPodemos aplicar la mayoría depropiedades que ya hemos empleado alas tablas, filas y columnas: fuente,tamaño, color, imagen de fondo.Existen algunas propiedades CSSespecíficas de las tablas, como el bordecolapsado. Dreamweaver no nos permiteasignar estos estilos con los asistentes,así que los veremos más adelante.Un estilo muy útil es el que nos permitecentrar la tabla en la página. Para ello,debemos editar los márgenes izquierdo yderecho (categoría Cuadro),estableciendo el valor auto para ambos
    • El tamaño de la tabla a través del inspectorde propiedades estará especificado por losvalores de An (anchura) y Al (altura).Normalmente sólo se especifica la anchura,no la altura.
    • • Lo primero que hay que hacer es, estando el cursor en una celda o seleccionando varias, desplegar el menú contextual de la tabla al pulsar con el botón derecho sobre ella, o bien abrir el menú Modificar. En ambos casos aparece la opción Tabla.• Según las celdas seleccionadas, algunas de las opciones de Tabla se podrán utilizar mientras que otras no.Para insertar una fila o una columna, hayque pulsar sobre las opciones Insertarfila o Insertar columna.La fila se inserta sobre la celda o elconjunto de celdas seleccionadas,mientras que la columna se inserta a suizquierda.
    • También tenemos una opción más completa, la opciónInsertar filas o columnas.... Al seleccionarla aparece unanueva ventana, donde es posible determinar si lo que seinsertarán serán filas o columnas, el número de ellas quese insertará, y la posición donde se insertarán.
    • Para eliminar una fila o una columna, hay que posicionar elcursor en la fila o columna a eliminar y elegir la opciónEliminar fila o Eliminar columna del menú Tabla. Tambiénse puede seleccionar la fila o columna a borrar y pulsar latecla de borrado (Del o Supr).
    • Es posible insertar tablas dentrode las celdas de otras tablas. Aesto se le llama anidar tablas. ANIDARPara anidar tablas sólo tienesque posicionar el cursor en lacelda donde quieres insertar lanueva tabla e insertarla como yahemos visto.
    • COMBINAR CELDASconsiste en convertir 2 o más celdas en una sola por lo quedejará de haber borde de separación entre una celda y otra yaque serán una sola. Esto nos puede servir por ejemplo parautilizar la primera fila para escribir el título de la tabla,normalmente más ancho. En este caso habría que combinartodas las celdas de la primera fila en una sola.Mientras que dividir celdas consiste en partir en dos unacelda.Una de las formas de dividir y combinar celdas es a través delinspector de propiedades
    • Para dividir una celda hay que pulsar sobre el botón delinspector de propiedades, o sobre la opción Dividir celdade la opción Tabla.En ambos casos, aparece una ventana como ésta, en laque hay que especificar si la celda se va a dividir en filas ocolumnas, y el número de éstas.
    • A la hora de trabajar con tablas Dreamweaver nosproporciona distintos modos de visualización. A través delmenú Ver opción Modo de tabla. Dentro de esta opciónpodemos elegir entre Modo estándar o el Modo de tablasexpandidas.
    • añade temporalmente relleno y espaciadode celda a las tablas de un documento yaumenta los bordes de las tablas parafacilitar la edición. Este modo se puedeutilizar para seleccionar elementos de lastablas o colocar el punto de inserción deforma precisa e introducir contenido pero eneste modo no vemos la página comoquedará exactamente
    • Existen dos tendenciasprincipales a la hora demaquetar (distribuir loselementos) en nuestra página:el diseño fijo y el diseñoelástico DISEÑO FIJOEl diseño fijo especificalas medidas en píxeles.Por lo que el contenidosiempre se mostrará delmismo tamaño, lo quefacilita mucho el diseño.
    • El diseño elástico especifica lasmedidas en porcentajes. Esto hace queel contenido se adapte al tamaño de laventana en la que se visualiza, lo que nospermite aprovecharla completamente.Como recordarás, el tamaño de las tablaspuede ser definido en píxeles o enporcentaje. Cuando el tamaño de la tablasea definido en píxeles, la tabla se verádel mismo modo independientemente deltamaño de la ventana del navegador. Encambio, cuando el tamaño de la tabla seadefinido en porcentaje, la tabla seajustará al tamaño del elemento que lacontiene, lo cual implica que el contenidode la tabla se puede descuadrar
    • Si modificas el tamaño de la ventana, verás quelas tablas se ajustan a ella. Usar tablas contamaño variable tiene también un graninconveniente, ya que si maximizas la ventana delnavegador apreciarás claramente cómo elcontenido de las tablasNo solo puede establecerse el tamaño de la tabla,también es posible establecer el tamaño de lasceldas