CSS - TABLAS

iSearchNotes is a FREE service that allows College Students to
Search and Share Class Notes.

Vote Up
0
Vote Down
By: profeinformatica 11
April 18, 2011 | Computer Science - Vicente Torregrosa
Save Notes for Word
.doc
3918
views

TABLAS

Las propiedades aplicables a la etiqueta TABLE son, entre otras:

border

Establece el grosor, el estilo de la linea y el color del borde

Ejemplo 1:

    table

    {

        border: 3px solid red;

    }

Establece un borde de 3 pixels de grosor, con estilo de línea contínua (solid) y de color rojo.

 

Si queremos que la tabla no tenga borde, simplemente hay que poner:

         border: 0px;

 

Los estilos de línea pueden ser:

  • solid: contínuo
  • dotted: con puntos
  • dashed: con rayas
  • double: doble línea
  • groove: con efecto 3D

width

Establece el ancho de la tabla. Se puede poner el tamaño en pixels o bien establecer un porcentaje con respecto al ancho de la página.

Ejemplo 2:

    table

    {

        width: 600px;

    }

La tabla tendría 600 pixels de ancho.

 

Ejemplo 3:

    table

    {

        width: 75%;

    }

La tabla ocuparía el 75% del ancho de la página. Si la resolución de la pantalla es de 1000 pixels, ocuparía 750 pixels.

 

margin

El margen de la tabla se utiliza para colocarla con respecto a la página.

Ejemplo 4:

    table

    {

        margin: 20px;

    }

Habría un margen de 20 pixels por arriba y por la izquierda

Ejemplo 5:

table

    {

        margin: auto;

    }

La opción auto sirve para centrar la página dentro de la tabla. Auto pone el mismo margen a izquierda y a derecha.

 

PROPIEDADES DE CELDAS

Al igual que en otras etiquetas ya vistas como BODY o P, podemos utilizar las propiedades de texto para hacer que todos los textos de una tabla, una fila o una celda aparezcan formateados.

Ejemplo 6:

    td

    {

        text-align: right;

    }

Alinearía el texto de cada celda a la derecha. Se aplica a la celda porque afecta a la etiqueta td.

Ejemplo 7:

    tr

    {

        background-color: green;
        color: white;

   }

Pondría el fondo de la fila de color verde y establecería el color de texto blanco.Se aplica a la celda porque afecta a la etiqueta tr.

Enjoyed These Notes?
Your support will help spread the extreme awesomeness that is iSearchNotes!

0 Comments

You must login to comment.
iSearchNotes.com on Facebook

Login - Register