Scribd Logo
Cargar

¡Te damos la bienvenida a Scribd!

  • PRACTICA 1 CSS, Daniela.

    Cargado por

    Daniela Baez
    27 vistas6 páginas

    Derechos de autor

    © © All Rights Reserved

    Formatos disponibles

    PDF, TXT o lea en línea desde Scribd

    ¿Le pareció útil este documento?

    ¿Este contenido es inapropiado?

    Denunciar este documento

    Copyright:

    © All Rights Reserved
    Descargue como PDF, TXT o lea en línea desde Scribd
    Marcar por contenido inapropiado
    27 vistas6 páginas

    PRACTICA 1 CSS, Daniela.

    Cargado por

    Daniela Baez

    Copyright:

    © All Rights Reserved
    Descargue como PDF, TXT o lea en línea desde Scribd
    Marcar por contenido inapropiado
    de 6

    Daniela R.

    Báez

    INTRODUCCION AL CSS

    1. Definición de CSS.
    CSS, en español «Hojas de estilo en cascada», es un lenguaje de diseño gráfico para
    definir y crear la presentación de un documento estructurado escrito en un lenguaje de
    marcado.

    2. Importancia de CSS en una página web.


    El CSS es un lenguaje para dar forma y diseño a documentos estructurados, dicho de
    otra forma, la gran mayoría del software que utilizamos en la red de redes lo utiliza:
    Páginas web, tiendas virtuales, foros, aplicaciones. Se suele utilizar primero HTML para
    crear la estructura básica de la web o aplicación para luego darle forma gráfica mediante
    CSS.

    Hoy en día la versión actual es CSS3 y contiene muchas mejoras respecto su versión
    anterior, entre ellas, la posibilidad de realizar webs y aplicaciones adaptables a
    dispositivos móviles.

    3. Funcionamiento Básico de CSS.


    CSS funciona como complemento a la información que forma parte de un sitio web.
    Mientras que el código en HTML incluye todos los datos, el código en CSS se encarga
    de darles formato y presentarlos visualmente a través de un navegador.

    4. Incluir CSS en un archivo HTML.


    Los estilos se definen en una zona específica del propio documento HTML. Se
    emplea la etiqueta <style> de HTML y solamente se pueden incluir en la cabecera
    del documento (sólo dentro de la sección <head>).
    Ejemplo:
    Daniela R. Báez

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml">

    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

    <title>Ejemplo de estilos CSS en el propio documento</title>

    <style type="text/css">

    p { color: black; font-family: Verdana; }

    </style>

    </head>

    <body>

    <p>Un párrafo de texto.</p>

    </body>

    </html>

    5. Definición de una regla CSS.


    Regla: cada uno de los estilos que componen una hoja de estilos CSS. Cada regla está
    compuesta de una parte de "selectores", un símbolo de "llave de apertura" ( { ), otra
    parte denominada "declaración" y por último, un símbolo de "llave de cierre" ( } ).

    6. Elemento de una regla CSS.


    Cada regla está compuesta de una parte de "selectores", un símbolo de "llave de
    apertura" ( { ), otra parte denominada "declaración" y por último, un símbolo de "llave
    de cierre" ( } ). Selector: indica el elemento o elementos HTML a los que se aplica la
    regla CSS.

    7. Medios CSS.
    Los tipos de medios indican los dispositivos para mostrar la página. En la hoja de
    estilos podemos escribir los siguientes:
    Daniela R. Báez

     all: Para todos los dispositivos. es el valor por defecto.


     braille: Para los dispositivos táctiles de braille.
     embossed: Para las impresoras de páginas braille.
     handheld: Para teléfonos móviles y dispositivos de mano (pantalla pequeña y ancho de
    banda limitada).
     print: Para impresoras y documentos vistos en pantalla en modo "vista previa a
    impresión".
     projection: Para proyectores y presentaciones proyectadas.
     screen: Para las pantallas de ordenadores en color. (PC, Mac, ...)
     speech: Para los sintetizadores de voz.
     tty: Para medios que usan una rejilla de caracteres de espacio fijo (Ej: teletipos,
    terminales, dispositivos portátiles con monitor de baja resolución, etc.).
     tv: Para televisores y dispositivos similares. (resolución baja, con color y sonido).

    8. Comentarios CSS.
    La sintaxis de comentarios /* */ es usada para comentarios de una o múltiples líneas. No
    hay otra forma de especificar comentarios en hojas de estilos externas. Sin embargo,
    cuando se usa el elemento <style>, se puede usar <! -- --> para ocultar CSS para
    navegadores antiguos, aunque no es recomendable.

    9. Sintaxis de la definición de las propiedades CSS.


    La sintaxis de definición describe qué valores están permitidos y las interacciones entre
    ellos. Un componente puede ser una palabra clave, algunos caracteres literales, ó un
    valor de tipo de dato de CSS o propiedad CSS.

    10.Selector en CSS.
    El selector Css es el identificador en la hoja de estilos del elemento o elementos del
    DOM a los que se aplicarán las declaraciones contenidas en la regla de la que forma
    parte dicho selector. Como curiosidad, en algunas partes, al elemento del DOM al que
    aplica el selector Css se le llama sujeto del selector.

    11.Selectores básicos.
    En CSS los selectores se utilizan para delimitar los elementos HTML de nuestra página
    web a los que queremos aplicar estilo. Hay una amplia variedad de selectores CSS, lo
    que permite una gran precisión a la hora de seleccionar elementos a los que aplicar
    estilo. En este artículo y sus subartículos veremos con detalle todos los tipos y el modo
    como funcionan.

    12.Selectores avanzados.
    Daniela R. Báez

    Utilizando solamente los selectores básicos de la sección anterior, es posible diseñar


    prácticamente cualquier página web. No obstante, CSS define otros selectores más
    avanzados que permiten simplificar las hojas de estilos.

    13.Agrupación de reglas en CSS


    Cuando se crean archivos CSS complejos con decenas o cientos de reglas, es habitual
    que los estilos que se aplican a un mismo selector se definan en diferentes reglas:
    h1 { color: red; }
    h1 { font-size: 2em; }
    h1 { font-family: Verdana; }
    Las tres reglas anteriores establecen el valor de tres propiedades diferentes de los
    elementos <h1>. Antes de que el navegador muestre la página, procesa todas las reglas
    CSS de la página para tener en cuenta todos los estilos definidos para cada elemento.
    Cuando el selector de dos o más reglas CSS es idéntico, se pueden agrupar las
    declaraciones de las reglas para hacer las hojas de estilos más eficientes:
    h1 {
    color: red;
    font-size: 2em;
    font-family: Verdana;
    }

    14.Que son Herencias en CSS.


    La herencia y la cascada son dos conceptos básicos en CSS. Se deben comprender bien
    para utilizar CSS. Por suerte, no son muy difíciles de entender, aunque algunos detalles
    pueden ser un tanto complicados de recordar.
    Ambos conceptos están relacionados, pero son diferentes. La herencia está relacionada
    con cómo los elementos del etiquetado de HTML heredan propiedades de sus elementos
    padres (los que los contienen) y los transmiten a sus hijos, mientras que la cascada tiene
    que ver con las declaraciones de CSS que se aplican a un documento y cómo las reglas
    contradictorias se anulan o no entre ellas.

    15.Colisiones de estilos.
    En las hojas de estilos complejas, es habitual que varias reglas CSS se apliquen a un
    mismo elemento HTML. El problema de estas reglas múltiples es que se pueden dar
    colisiones como la del siguiente ejemplo:

    p { color: red; }
    p { color: blue; }

    <p>...</p>
    Daniela R. Báez

    16.RGB decimal CSS.


    Los colores en los monitores de los ordendadores personales y dispositivos móviles
    como tablets, smartphones, etc. se forman por combinación de tres colores básicos: rojo
    (Red), verde (Green) y azul (Blue). La combinación de las letras de estos tres colores en
    inglés es RGB y así se denomina al sistema de construcción de colores basado en
    indicar la proporción de cada uno de estos tres colores. Hay otros sistemas como el
    CMYK que son de aplicación en el diseño y la industria gráfica y de edición, pero no en
    los desarrollos web.
    Un color con el sistema RGB se escribe en CSS así:
    rgb (cantidadDeRojo, cantidadDeVerde, CantidadDeAzul)
    La cantidad de cada color se expresa entre un valor mínimo que es cero y un valor
    máximo que es 255. Si se indicara un número menor que cero se consideraría cero, o si
    se indica un número mayor que 255 se consideraría 255. El color rgb (0, 0, 0) es el
    negro y el color rgb (255, 255, 255) es el blanco. El color rojo será el rgb (255, 0, 0), el
    verde rgb (0, 255, 0) y el azul (0, 0, 255).
    La mezcla completa de rojo y verde sin azul da lugar al amarillo: rgb (255, 255, 0).

    17.RGB porcentual.
    RGB porcentual. Las componentes RGB de un color también se pueden indicar
    mediante un porcentaje. El funcionamiento y la sintaxis de este método es el mismo que
    el del RGB decimal. La única diferencia es que en este caso el valor de las componentes
    RGB puede tomar valores entre 0% y 100% .

    18.Hexadecimal.
    El sistema hexadecimal es, por lo tanto, un sistema de numeración posicional que tiene
    como base el 16. Esto quiere decir que el sistema hexadecimal utiliza 16 dígitos
    diferentes. En otras palabras: hay 16 dígitos, frente a los dos del sistema binario (1 y 0)
    o los diez del sistema decimal (de 0 a 9).
    Daniela R. Báez

    19.Que son colisiones en CSS.


    Una colisión no es un error en el sentido que incumpla una norma, ni la página web
    mostrará ningún error. CSS tiene definidas las pautas para resolver las colisiones sin
    producir ambigüedades o errores.

    20.QUE ES EL ID EN CCS.
    El atributo global id define un identificador único (ID) el cual no debe repetirse en todo
    el documento. Su propósito es identificar el elemento al vincularlo (usando un
    identificador de fragmento), en scripts u hojas de estilo (con CSS).

    21.QUE SON CLASES EN CSS.


    Las clases en CSS nos permiten identificar elementos de manera general para
    posteriormente modificar sus estilos. Sin embargo, en el proceso de diseño de una
    página web, a veces necesitamos ser más específicos con lo que queremos estilizar.

    También podría gustarte