Scribd Logo
Încărcați

Bine ați venit la Scribd!

  • FICHA DE INFORMACIÓN - Tabla en Css

    Încărcat de

    Herald
    26 vizualizări2 pagini

    Titlu original

    FICHA DE INFORMACIÓN_tabla en css.docx

    Drepturi de autor

    © © All Rights Reserved

    Formate disponibile

    DOCX, PDF, TXT sau citiți online pe Scribd

    Vi se pare util acest document?

    Este necorespunzător acest conținut?

    Raportați acest document

    Drepturi de autor:

    © All Rights Reserved
    Descărcați ca DOCX, PDF, TXT sau citiți online pe Scribd
    Indicator pentru conținut neadecvat
    26 vizualizări2 pagini

    FICHA DE INFORMACIÓN - Tabla en Css

    Încărcat de

    Herald

    Drepturi de autor:

    © All Rights Reserved
    Descărcați ca DOCX, PDF, TXT sau citiți online pe Scribd
    Indicator pentru conținut neadecvat
    din 2

    FICHA DE INFORMACIÓN: TABLAS EN CSS o auto. Valor por defecto.

    Aunque hayamos indicado anchura


    LAS TABLAS Y EL ESTILO CSS para tabla y/o celdas, su tamaño se determina por el
    La mayoría de propiedades de uso habitual en CSS (bordes, colores, contenido de las mismas (si el contenido requiere mayor
    tipos de letra, alineaciones,...) son perfectamente aplicables a las anchura, así se hará.
    tablas. Sin embargo hay propiedades CSS que, explícitamente,
    sirven para modificar la forma de visualizar los elementos de una o fixed. Predomina la anchura establecida por las propiedades
    tabla. y no por el contenido
    ESPACIADO Y BORDE EN LAS TABLAS
    Las propiedades CSS específicas para tablas son:
    ACTIVIDAD: TABLAS EN CSS
    a) border-collapse :
    Permite indicar cómo manejar los bordes adyacentes entre
    elementos. Posibles valores: EN HTML
    o collapse. Se unen los bordes adyacentes para 1. ABRIR BLOC DE NOTAS Y ESCRIBA EL SIGUIENTE TEXTO EN
    formar un único borde. Es decir no hay espacio entre bordes HTML:
    adyacentes. <!DOCTYPE html>
    o separate. Los bordes adyacentes se mantienen <html lang=”es”>
    separados. Es el valor por defecto. <head>
    table{ <title>TABLA CON CSS</title>
    width:100%; <link rel="stylesheet" href="D:/CSS_tex/estilostabla.css">
    border-collapse:collapse; </head>
    } <body>
    td{ <table class="tabla">
    border:2px solid black; <tr>
    } <th>N°</th>
    Hay que fijarse en que es en el elemento table (el contenedor <th>ALUMNO</th>
    general de la tabla) en el que se indica esta propiedad. <th>TRABAJO</th>
    b) border-spacing : </tr>
    Indica el espacio entre bordes. Admite dos medidas, la primera se <tr>
    utiliza para la distancia horizontal y la segunda para la vertical. Si se <td>1</td>
    utiliza una medida se referirá a ambas distancias. <td>Carlos</td>
    Ejemplo: <td>Programador</td>
    border-spacing:10px 5px; </tr>
     caption-side. Posición del título de la tabla <tr>
    (elemento caption). Posibilidades: top (arriba, valor por <td>2</td>
    defecto), bottom (abajo). <td>Luis</td>
     empty-cells. Indica si deseamos mostrar las celdas vacías <td>Diseñador web</td>
    de la tabla. Valores: show (mostrar, valor por defecto) </tr>
    y hide (ocultar). No funciona (hide) con los bordes colapsados. <tr>
     table-layout. Propiedad presente en los últimos <td>3</td>
    navegadores (no en Internet Explorer) permite indicar la <td>José</td>
    forma en la que se calcula la anchura de las celdas. Por <td>Diseñador gráfico</td>
    defecto toma el valor auto, en el que, aunque hayamos </tr>
    indicado una anchura fija para una celda, el tamaño de la <tr>
    misma depende del contenido. fixed, sin embargo deja la tabla <td>4</td>
    con el tamaño fijado por las propiedades de anchura de <td>Raúl</td>
    columna (width). <td>Técnico</td>
    </tr>
    </table>
    c) caption-side.
    </body>
    </html>
    Propiedad utilizada para la etiqueta caption que contiene el 1. GUARDAR EN DISCO D: EN LA CARPETA CSS CON EL
    título de una tabla. Permite indicar si queremos que el título
    NOMBRE DE tabla.html TIPO todos los archivos
    esté por encima de la tabla (valor top, valor por defecto) o por
    debajo (valor bottom) EN CSS

    1. ABRIR OTRO BLOC DE NOTAS Y ESCRIBA EL SIGUIENTE TEXTO EN


    d) empty-cells.
    CSS:
    Permite especificar si los bordes y sombreados de la tabla se
    .tabla{
    aplican a las celdas vacías. Valores:
    border:1px solid;
    width:400px;
    o show. Se aplican bordes y sombreados a esas border-collapse:collapse;
    celdas (valor por defecto) }
    .tabla td{
    o hide. No se aplican los bordes y sombreados a las background:#00FFFF;
    celdas vacías. border:1px solid;
    text-align:center;
    e) table-layout. }
    Indica la forma en la que se determina la anchura de la .tabla th{
    tabla y las celdas. Posibles valores: background-color:blue;
    color:yellow;
    font-family:comic sans ms;
    }
    .tabla td:hover{
    background-color:red;
    font-size:30px;
    }
    .tabla tr:hover{
    background-color:purple;
    font-size:20px;
    }
    1. GUARDAR EN DISCO D: EN LA CARPETA CSS CON EL
    NOMBRE DE estilotabla.css TIPO todos los archivos

    S-ar putea să vă placă și