Anda di halaman 1dari 10

CSS Hojas de Estilo en Cascada Las hojas de estilo en cascada (Cascading Style Sheets) hacen referencia a un lenguaje de hojas

de estilos usado para describir la presentacin semntica (el aspecto y formato) de un documento escrito en lenguaje de marcas. Su aplicacin ms comn es dar estilo a pginas webs escritas en lenguaje HTML y XHTML, pero tambin puede ser aplicado a cualquier tipo de documentos XML, incluyendo SVG y XUL. La informacin de estilo puede ser adjuntada como un documento separado o en el mismo documento HTML. En este ltimo caso podran definirse estilos generales en la cabecera del documento o en cada etiqueta particular mediante el atributo "<style>". Por qu se llama en cascada? Cuando creamos un estilo, las especificaciones que se realicen para un determinado elemento sern aplicables a todos aquellos elementos que se encuentren "por debajo" de l atendiendo a un criterio de herencia. Por ejemplo, si especificamos un tipo de letra para el elemento <body> todos aquellos elementos que puedan heredar las caractersticas se presentarn con el mismo tipo de fuente. As, el elemento <p> heredar el tipo de letra salvo que especifiquemos lo contrario. Tambin debemos de tener en cuenta que se establece un orden de prioridad para la aplicacin de las normas en caso de que resulten contradictorias. El orden de preferencia para aplicar una norma es el siguiente: - Estilo especificado dentro de la etiqueta. - Estilo especificado en la cabecera del documento. - Estilo definido en un documento independiente al que se enlaza nuestra pgina.

Si tenemos en cuenta el orden mencionado, lo ms razonable es crear una hoja de estilo en un archivo independiente y vincular las pginas a este archivo. Si queremos realizar alguna modificacin en un elemento concreto podramos recurrir a uno de los dos primeros procedimientos que deberan resultar preferentes por ser ms especficos. Sintaxis CSS tiene una sintaxis muy sencilla, que usa unas cuantas palabras claves tomadas del ingls para especificar los nombres de sus selectores, propiedades y atributos. Una hoja de estilos CSS consta de 3 reglas. Cada regla consiste en uno o ms selectores y un bloque de estilos con los estilos a aplicar para los elementos del documento que cumplan con el selector que les precede. Cada bloque de estilos se define entre llaves, y est formado por una o varias declaraciones de estilo con el formato propiedad:valor;. En el CSS, los selectors marcarn qu elementos se vern afectados por cada bloque de estilo que les siga, pudiendo afectar a uno o varios elementos a la vez, en funcin de su tipo, nombre (name), ID, clase (class), posicin dentro del Document Object Model, etctera.

Ejemplo: selector [, selector2, class][::pseudo-element] { propiedad: valor; [propiedad2: valor2; ...] } /* comentarios */ Uso Por ejemplo, el elemento de HTML <h1> indica que un bloque de texto es un encabezamiento y que es ms importante que un bloque etiquetado como <h2>. Versiones ms antiguas de HTML permitan atributos extra dentro de la etiqueta abierta para darle formato (como el color o el tamao de fuente). ...] [:pseudo-

No obstante, cada etiqueta <h1> deba disponer de la informacin si se deseaba un diseo consistente para una pgina y, adems, una persona que lea esa pgina con un navegador perda totalmente el control sobre la visualizacin del texto. Cuando se utiliza CSS, la etiqueta <h1> no debera proporcionar informacin sobre cmo ser visualizado, solamente marca la estructura del documento. La informacin de estilo, separada en una hoja de estilo, especfica cmo se ha de mostrar <h1>: color, fuente, alineacin del texto, tamao y otras caractersticas no visuales, como definir el volumen de un sintetizador de voz, por ejemplo. Por otro lado, antes de que estuviera disponible CSS, la nica forma de componer espacialmente una pgina era el uso de tablas <table>. Aunque esta era una tcnica cmoda y verstil, ello conllevaba el uso de un elemento con una semntica particular, y en el que la distribucin de los datos no se ajustaban al flujo de la informacin que se obtena en la vista desde los navegadores habituales, lo que redundaba en una merma en la accesibilidad a la pgina por parte de otros navegadores (orientados a personas con alguna deficiencia sensorial, o a ciertos dispositivos electrnicos). Mediante el uso de CSS, se ha permitido eliminar el uso de tablas para el diseo, usndolas solamente para la muestra de datos tabulados, si bien es cierto que obtener la versatilidad que ofreca el diseo con tablas, es algo ms complicado si no se usan. Formas en las que se pude usar CSS Para dar formato a un documento HTML, puede emplearse CSS de tres formas distintas: 1. Mediante CSS introducido por el autor del HTML Un estilo en lnea (online) es un mtodo para insertar el lenguaje de estilo de pgina directamente dentro de una etiqueta HTML. Esta manera de proceder no es totalmente adecuada. El incrustar la descripcin del formateo dentro del documento de la pgina Web, a nivel de cdigo, se convierte en una manera larga, tediosa y poco elegante de resolver el problema de la programacin de la pgina. Este modo de trabajo se podra usar de manera ocasional

si se pretende aplicar un formateo con prisa, al vuelo. No es todo lo claro o estructurado que debera ser, pero funciona. Dado que los clientes de correo electrnico no soportan las hojas de estilos externas, y que no existen estndares que los fabricantes de clientes de correo respeten para utilizar CSS en este contexto, la solucin ms recomendable para maquetar correos electrnicos, es utilizar CSS dentro de los propios elementos (online). Una hoja de estilo interna, que es una hoja de estilo que est incrustada dentro de un documento HTML, dentro del elemento <head>, marcada por la etiqueta <style>. De esta manera se obtiene el beneficio de separar la informacin del estilo del cdigo HTML propiamente dicho. Se puede optar por copiar la hoja de estilo incrustada de una pgina a otra (esta posibilidad es difcil de ejecutar si se desea para guardar las copias sincronizadas). En general, la nica vez que se usa una hoja de estilo interna, es cuando se quiere proporcionar alguna caracterstica a una pgina Web en un simple fichero, por ejemplo, si se est enviando algo a la pgina Web. Una hoja de estilo externa, es una hoja de estilo que est almacenada en un archivo diferente al archivo donde se almacena el cdigo HTML de la pgina Web. Esta es la manera de programar ms potente, porque separa completamente las reglas de formateo para la pgina HTML de la estructura bsica de la pgina. 2. Estilos CSS introducidos por el usuario que ve el documento, mediante un archivo CSS especificado mediante las configuraciones del navegador, y que sobrescribe los estilos definidos por el autor en una, o varias pginas web. 3. Los estilos marcados "por defecto" por los user agent, para diferentes elementos de un documento HTML, como por ejemplo, los enlaces.

Historia y Niveles CSS se ha creado en varios niveles y perfiles. Cada nivel de CSS se construye sobre el anterior, generalmente aadiendo funciones al previo. Actualmente, pueden usarse perfiles para dispositivos mviles, impresoras o televisiones. CSS1 La primera especificacin oficial de CSS, recomendada por la W3C fue CSS1, publicada en diciembre 1996 y abandonada en abril de 2008. Algunas de las funcionalidades que ofrece son:

Propiedades de las Fuente, como tipo, tamao, nfasis... Color de texto, fondos, bordes u otros elementos. Atributos del texto, como espaciado entre palabras, letras, lneas, etctera. Alineacin de textos, imgenes, tablas u otros. Propiedades de caja, como margen, borde, relleno o espaciado. Propiedades de identificacin y presentacin de listas.

CSS2 La especificacin CSS2 fue desarrollada por la W3C y publicada como recomendacin en mayo de 1998, y abandonada en abril de 2008. Como ampliacin de CSS1, se ofrecieron, entre otras:

Las funcionalidades propias de las capas (<div>) como de posicionamiento relativo/absoluto/fijo, niveles (z-index), etctera. El concepto de "media types", Soporte para las hojas de estilo auditivas Texto bidireccional, sombras, etctera.

CSS 2.1 La primera revisin de CSS2, usualmente conocida como "CSS 2.1", corrige algunos errores encontrados en CSS2, elimina funcionalidades poco

soportadas o inoperables en los navegadores y aade alguna nueva especificacin. De acuerdo al sistema de estandarizacin tcnica de las especificaciones, CSS2.1 tuvo el estatus de "candidato" (candidate recommendation) durante varios aos ,pero la propuesta fue rechazada en junio de 2005; en junio de 2007 fue propuesta una nueva versin candidata, y sta actualizada en 2009, pero en diciembre de 2010 fue nuevamente rechazada. En abril de 2011, CSS 2.1 volvi a ser propuesta como candidata, y despus de ser revisada por el W3C Advisory Committee, fue finalmente publicada como recomendacin oficial el 7 de junio de 2011. CSS3 A diferencia de CSS2, que fue una gran especificacin que defina varias funcionalidades, CSS3 est dividida en varios documentos separados, llamados "mdulos". Cada mdulo aade nuevas funcionalidades a las definidas en CSS2, de manera que se preservan las anteriores para mantener la compatibilidad. Los trabajos en el CSS3, comenzaron a la vez que se public la recomendacin oficial de CSS2, y los primeros borradores de CSS3 fueron liberados en junio de 1999. Debido a la modularizacin del CSS3, diferentes mdulos pueden encontrarse en diferentes estadios de su desarrollo, de forma que a fechas de noviembre de 2011, hay alrededor de cincuenta mdulos publicados, tres de ellos se convirtieron en recomendaciones oficiales de la W3C en 2011: "Selectores", "Espacios de nombres" y "Color". Algunos mdulos, como "Fondos y colores", "Consultas de medios" o "Diseos multicolumna" estn en fase de "candidatos", y considerados como razonablemente estables, a finales de 2011, y sus implementaciones en los diferentes navegadores son sealadas con los prefijos del motor del mismo.

Limitaciones y Ventajas Algunas limitaciones que se encuentran en el uso del CSS hasta la versin CSS2.1, vigente, pueden ser:

Los selectores no pueden usarse en orden ascendente segn la jerarqua del DOM (hacia padres u otros ancestros) como se hace mediante XPath La razn que se ha usado para justificar esta carencia por parte de la W3C, es para proteger el rendimiento del navegador, que de otra manera, podra verse comprometido. XSLT soporta en la actualidad un mayor nmero de sistemas operativos. As mismo, tambin es mejor para trabajar con la mayora de buscadores de Internet. Dificultad para el alineamiento vertical; as como el centrado horizontal se hace de manera evidente en CSS2.1, el centrado vertical requiere de diferentes reglas en combinaciones no evidentes, o no estndares. Ausencia de expresiones de clculo numrico para especificar valores (por ejemplo margin-left: 10% 3em + 4px;). Un borrador de la W3C para CSS3, propone calc() para solventar esta limitacin. Las pseudo-clases dinmicas (como :hover) no se pueden controlar o deshabilitar desde el navegador, lo que las hace susceptibles de abuso por parte de los diseadores en banners, o ventana emergentes.

Algunas ventajas de utilizar CSS son:


Control centralizado de la presentacin de un sitio web completo con lo que se agiliza de forma considerable la actualizacin del mismo. Separacin del contenido de la presentacin, lo que facilita al creador, diseador, usuario o dispositivo electrnico que muestre la pgina, la modificacin de la visualizacin del documento sin alterar el contenido del mismo, slo modificando algunos parmetros del CSS. Optimizacin del ancho de banda de la conexin, pues pueden definirse los mismos estilos para muchos elementos con un slo selector; o porque un mismo archivo CSS puede servir para una multitud de documentos. Mejora en la accesibilidad del documento, pues con el uso del CSS se evitan antiguas prcticas necesarias para el control del diseo.

Introduccin Las hojas de estilo son tiles para definir los atributos visuales en documentos HTML. Esto les da a los autores mtodos poderosos para definir el aspecto visual del documento, mientras que separa la parte semntica (HTML) de la prestacional (style sheets). Su aplicacin ms comn es dar estilo a pginas webs.

Conclusiones Las hojas de estilo CSS son una gran herramienta ya que da la posibilidad de separar los elementos formales de los de contenido. De esta forma, slo con una pequea modificacin de la hoja de estilo es posible cambiar el aspecto de todas las pginas en las que se aplica esa hoja. No todos los navegadores soportan esta herramienta.

UNIVERSIDAD MARIANO GALVEZ Ingeniera en Sistemas de informacin Pgina Web Ing. Marvin Xiloj

CSS HOJAS DE ESTILO EN CASCADA

Integrantes: Balam Denis Rigoberto Saloj Saloj Edwin Ral De Len Mndez Eduardo lvarez Njera Paulo Cesar Garca Paniagua 1290-11-4039 1290-11-4030 1290-11-4331 1290-11-4149

Antigua Guatemala 29/04/2013

Anda mungkin juga menyukai