stringtranslate.com

CSS

Las hojas de estilo en cascada ( CSS ) son un lenguaje de hojas de estilo que se utiliza para especificar la presentación y el estilo de un documento escrito en un lenguaje de marcado como HTML o XML (incluidos los dialectos XML como SVG , MathML o XHTML ). [1] CSS es una tecnología fundamental de la World Wide Web , junto con HTML y JavaScript . [2]

CSS está diseñado para permitir la separación de contenido y presentación , incluyendo diseño , colores y fuentes . [3] Esta separación puede mejorar la accesibilidad del contenido , ya que el contenido se puede escribir sin preocuparse por su presentación; proporcionar más flexibilidad y control en la especificación de las características de presentación; permitir que varias páginas web compartan formato especificando el CSS relevante en un archivo .css separado, lo que reduce la complejidad y la repetición en el contenido estructural; y permitir que el archivo .css se almacene en caché para mejorar la velocidad de carga de la página entre las páginas que comparten el archivo y su formato.

La separación de formato y contenido también permite presentar la misma página de marcado en diferentes estilos para diferentes métodos de representación, como en pantalla, en forma impresa, por voz (a través de un navegador basado en voz o un lector de pantalla ) y en dispositivos táctiles basados ​​en Braille . CSS también tiene reglas para el formato alternativo si se accede al contenido en un dispositivo móvil . [4]

El nombre "en cascada" proviene del esquema de prioridad especificado para determinar qué declaración se aplica si más de una declaración de una propiedad coincide con un elemento en particular. Este esquema de prioridad en cascada es predecible.

Las especificaciones CSS son mantenidas por el Consorcio World Wide Web (W3C). El tipo de medio de Internet ( tipo MIME ) text/cssestá registrado para su uso con CSS por RFC 2318 (marzo de 1998). El W3C opera un servicio gratuito de validación de CSS para documentos CSS. [5]

Además de HTML, otros lenguajes de marcado admiten el uso de CSS, incluidos XHTML , XML simple , SVG y XUL . CSS también se utiliza en el kit de herramientas de widgets GTK .

Sintaxis

CSS tiene una sintaxis simple y utiliza una serie de palabras clave en inglés para especificar los nombres de varias propiedades de estilo.

Hoja de estilo

Una hoja de estilo consta de una lista de reglas . Cada regla o conjunto de reglas consta de uno o más selectores y un bloque de declaración .

Selector

En CSS, los selectores declaran a qué parte del marcado se aplica un estilo haciendo coincidir las etiquetas y los atributos en el marcado mismo.

Tipos de selector

Los selectores pueden aplicar a lo siguiente:

Las clases y los identificadores distinguen entre mayúsculas y minúsculas, comienzan con letras y pueden incluir caracteres alfanuméricos, guiones y guiones bajos. Una clase puede aplicarse a cualquier cantidad de instancias de cualquier elemento. Un identificador solo puede aplicarse a un único elemento.

Pseudo-clases

Las pseudoclases se utilizan en los selectores CSS para permitir el formato basado en información que no está contenida en el árbol del documento.

Un ejemplo de una pseudoclase muy utilizada es , que identifica el contenido solo cuando el usuario "señala" el elemento visible, normalmente manteniendo el cursor del ratón sobre él. Se adjunta a un selector como en o .:hovera:hover#elementid:hover

Una pseudoclase clasifica elementos de un documento, como o , mientras que un pseudoelemento realiza una selección que puede constar de elementos parciales, como o . [6] Nótese la distinción entre la notación de dos puntos dobles utilizada para pseudoelementos y la notación de dos puntos simples utilizada para pseudoclases.:link:visited::first-line::first-letter

Combinadores

Se pueden unir varios selectores simples mediante combinadores para especificar elementos por ubicación, tipo de elemento, id, clase o cualquier combinación de estos. [7] El orden de los selectores es importante. Por ejemplo, se aplica a todos los elementos de la clase myClass que están dentro de elementos div, mientras que se aplica a todos los elementos div que están dentro de elementos de la clase myClass. Esto no debe confundirse con identificadores concatenados como que se aplica a los elementos div de la clase myClass.div .myClass {color: red;}.myClass div {color: red;}div.myClass {color: red;}

Resumen de la sintaxis del selector

La siguiente tabla proporciona un resumen de la sintaxis del selector indicando su uso y la versión de CSS que lo introdujo. [8]

Bloque de declaración

Un bloque de declaración consta de un par de llaves ( {}) que encierran una lista de declaraciones separadas por punto y coma . [9]

Declaración

Cada declaración consta de una propiedad , dos puntos ( :) y un valor . Se pueden incluir espacios en blanco opcionales alrededor del bloque de declaración, declaraciones, dos puntos y punto y coma para facilitar la lectura. [10]

Propiedades

Las propiedades se especifican en el estándar CSS. Cada propiedad tiene un conjunto de valores posibles. Algunas propiedades pueden afectar a cualquier tipo de elemento y otras se aplican solo a grupos de elementos particulares. [11] [12]

Valores

Los valores pueden ser palabras clave, como "centro" o "heredarse", o valores numéricos, como 200px(200 píxeles), 50vw(50 por ciento del ancho de la ventana gráfica) o 80% (80 por ciento del ancho del elemento principal).

Los valores de color se pueden especificar con palabras clave (por ejemplo, " red"), valores hexadecimales (por ejemplo , , también abreviado como ), valores RGB en una escala de 0 a 255 (por ejemplo, ), valores RGBA que especifican tanto el color como la transparencia alfa (por ejemplo, ), o valores HSL o HSLA (por ejemplo , , ). [13]#FF0000#F00rgb(255, 0, 0)rgba(255, 0, 0, 0.8)hsl(0 100% 50%)hsl(0 100% 50% / 0.8)

Los valores numéricos distintos de cero que representan medidas lineales deben incluir una unidad de longitud, que es un código alfabético o una abreviatura, como en 200pxo 50vw; o un signo de porcentaje, como en 80%. Algunas unidades – cm( centímetro ); in( pulgada ); mm( milímetro ); pc( pica ); y pt( punto ) – son absolutas , lo que significa que la dimensión representada no depende de la estructura de la página; otras – em( em ); ex( ex ) y px( píxel ) [ aclaración necesaria ] – son relativas , lo que significa que factores como el tamaño de fuente de un elemento padre pueden afectar la medida representada. Estas ocho unidades fueron una característica de CSS 1 [14] y se mantuvieron en todas las revisiones posteriores. El Módulo de Valores y Unidades CSS Nivel 3 propuesto, si se adopta como Recomendación del W3C, proporcionará siete unidades de longitud adicionales: ch; Q; rem; ; vh; vmax; vminy vw. [15]

Usar

Antes de CSS, casi todos los atributos de presentación de los documentos HTML estaban contenidos en el código HTML. Todos los colores de fuente, estilos de fondo, alineaciones de elementos, bordes y tamaños tenían que describirse explícitamente, a menudo repetidamente, dentro del HTML. CSS permite a los autores mover gran parte de esa información a otro archivo, la hoja de estilos, lo que da como resultado un HTML considerablemente más simple. Además, a medida que cada vez más dispositivos pueden acceder a páginas web adaptables, comienzan a aparecer diferentes tamaños de pantalla y diseños. Personalizar un sitio web para cada tamaño de dispositivo es costoso y cada vez más difícil. La naturaleza modular de CSS significa que los estilos se pueden reutilizar en diferentes partes de un sitio o incluso en varios sitios, lo que promueve la coherencia y la eficiencia.

Por ejemplo, los encabezados ( h1elementos), subtítulos ( h2), subsubtítulos ( h3), etc., se definen estructuralmente mediante HTML. En la versión impresa y en la pantalla, la elección de la fuente , el tamaño , el color y el énfasis de estos elementos es una cuestión de presentación .

Antes de CSS, los autores de documentos que querían asignar dichas características tipográficash2 a, por ejemplo, todos los encabezados, tenían que repetir el marcado de presentación HTML para cada aparición de ese tipo de encabezado. Esto hacía que los documentos fueran más complejos, más grandes y más propensos a errores y difíciles de mantener. CSS permite la separación de la presentación de la estructura. CSS puede definir el color, la fuente, la alineación del texto, el tamaño, los bordes, el espaciado, el diseño y muchas otras características tipográficas, y puede hacerlo de forma independiente para las vistas en pantalla e impresas. CSS también define estilos no visuales, como la velocidad de lectura y el énfasis para los lectores de texto auditivos. El W3C ha desaprobado ahora el uso de todo el marcado HTML de presentación. [16]

Por ejemplo, en HTML pre-CSS, un elemento de encabezado definido con texto rojo se escribiría como:

< h1 >< font  color = "red" > Capítulo 1. </ font ></ h1 >

Usando CSS, el mismo elemento se puede codificar usando propiedades de estilo en lugar de atributos de presentación HTML:

< h1  style = "color: red;" > Capítulo 1. </ h1 >

Las ventajas de esto pueden no ser evidentes de inmediato, pero el poder de CSS se hace más evidente cuando las propiedades de estilo se colocan en un elemento de estilo interno o, mejor aún, en un archivo CSS externo. Por ejemplo, supongamos que el documento contiene el elemento de estilo:

< estilo > h1 { color : rojo ; } </ estilo >     

Todos h1los elementos del documento se volverán automáticamente de color rojo sin necesidad de código explícito. Si más adelante el autor quisiera que h1los elementos fueran de color azul, podría hacerlo cambiando el elemento de estilo a:

< estilo > h1 { color : azul ; } </ estilo >     

en lugar de revisar laboriosamente el documento y cambiar el color de cada h1elemento individual.

Los estilos también se pueden colocar en un archivo CSS externo, como se describe a continuación, y cargar utilizando una sintaxis similar a la siguiente:

< link  href = "ruta/al/archivo.css"  rel = "hoja/de/estilo"  type = "texto/css" >

Esto desacopla aún más el estilo del documento HTML y hace posible cambiar el estilo de varios documentos simplemente editando un archivo CSS externo compartido.

Fuentes

CSS, o Cascading Style Sheets, ofrece una forma flexible de diseñar contenido web, con estilos que se originan a partir de los valores predeterminados del navegador, las preferencias del usuario o los diseñadores web. Estos estilos se pueden aplicar en línea, dentro de un documento HTML o mediante archivos .css externos para lograr una mayor coherencia. Esto no solo simplifica el desarrollo web al promover la reutilización y la facilidad de mantenimiento, sino que también mejora el rendimiento del sitio porque los estilos se pueden descargar en archivos .css dedicados que los navegadores pueden almacenar en caché. Además, incluso si los estilos no se pueden cargar o están deshabilitados, esta separación mantiene la accesibilidad y legibilidad del contenido, lo que garantiza que el sitio sea utilizable para todos los usuarios, incluidos aquellos con discapacidades. Su enfoque multifacético, que incluye consideraciones sobre la especificidad del selector, el orden de las reglas y los tipos de medios, garantiza que los sitios web sean visualmente coherentes y adaptables en diferentes dispositivos y necesidades de los usuarios, logrando un equilibrio entre la intención del diseño y la accesibilidad del usuario.

Varias hojas de estilo

Se pueden importar varias hojas de estilo. Se pueden aplicar distintos estilos según el dispositivo de salida que se utilice; por ejemplo, la versión para pantalla puede ser muy distinta de la versión impresa, de modo que los autores pueden adaptar la presentación de forma adecuada para cada medio.

En cascada

La hoja de estilo con la prioridad más alta controla la visualización del contenido. Las declaraciones que no se establecen en la fuente con la prioridad más alta se pasan a una fuente de menor prioridad, como el estilo del agente de usuario. El proceso se denomina en cascada .

Uno de los objetivos de CSS es permitir a los usuarios un mayor control sobre la presentación . Alguien a quien le resulte difícil leer los encabezados en cursiva roja puede aplicar una hoja de estilo diferente. Según el navegador y el sitio web, un usuario puede elegir entre varias hojas de estilo proporcionadas por los diseñadores, o puede eliminar todos los estilos agregados y ver el sitio usando el estilo predeterminado del navegador, o puede anular solo el estilo de encabezado en cursiva roja sin alterar otros atributos. Se han creado extensiones de navegador como Stylish y Stylus para facilitar la administración de dichas hojas de estilo de usuario. En el caso de proyectos grandes, se puede utilizar la cascada para determinar qué estilo tiene una mayor prioridad cuando los desarrolladores integran estilos de terceros que tienen prioridades conflictivas y para resolver aún más esos conflictos. Además, la cascada puede ayudar a crear diseños temáticos, que ayudan a los diseñadores a ajustar aspectos de un diseño sin comprometer el diseño general.

Esquema de prioridades CSS

Especificidad

La especificidad se refiere a los pesos relativos de varias reglas. [17] Determina qué estilos se aplican a un elemento cuando más de una regla podría aplicarse. Según la especificación, un selector simple (por ejemplo, H1) tiene una especificidad de 1, los selectores de clase tienen una especificidad de 1,0 y los selectores de ID tienen una especificidad de 1,0,0. Debido a que los valores de especificidad no se transfieren como en el sistema decimal, se utilizan comas para separar los "dígitos" [18] (una regla CSS que tenga 11 elementos y 11 clases tendría una especificidad de 11,11, no 121).

Así pues, los selectores de la siguiente regla dan como resultado la especificidad indicada:

Ejemplos

Considere este fragmento HTML:

<!DOCTYPE html> < html >  < head >  < meta  charset = "utf-8" >  < style > # xyz { color : blue ; } </ style > </ head > < body > < p id = "xyz" style = "color: green;" > Para demostrar especificidad </ p > </ body > </ html >            

En el ejemplo anterior, la declaración en el styleatributo anula la del <style>elemento porque tiene una mayor especificidad y, por lo tanto, el párrafo aparece en verde:

Para demostrar especificidad

Herencia

La herencia es una característica clave en CSS; depende de la relación ancestro-descendiente para operar. La herencia es el mecanismo por el cual las propiedades se aplican no solo a un elemento especificado sino también a sus descendientes. [17] La ​​herencia se basa en el árbol del documento, que es la jerarquía de elementos XHTML en una página basada en anidamiento. Los elementos descendientes pueden heredar valores de propiedad CSS de cualquier elemento ancestro que los encierre. En general, los elementos descendientes heredan propiedades relacionadas con el texto, pero sus propiedades relacionadas con el cuadro no se heredan. Las propiedades que se pueden heredar son color, fuente, espaciado entre letras, altura de línea, estilo de lista, alineación de texto, sangría de texto, transformación de texto, visibilidad, espacio en blanco y espaciado de palabras. Las propiedades que no se pueden heredar son fondo, borde, visualización, flotante y transparente, altura y ancho, margen, altura y ancho mínimos y máximos, contorno, desbordamiento, relleno, posición, decoración de texto, alineación vertical e índice z.

La herencia se puede utilizar para evitar declarar ciertas propiedades una y otra vez en una hoja de estilo, lo que permite un CSS más corto.

La herencia en CSS no es lo mismo que la herencia en lenguajes de programación basados ​​en clases , donde es posible definir la clase B como "como la clase A, pero con modificaciones". [19] Con CSS, es posible aplicar estilo a un elemento con "clase A, pero con modificaciones". Sin embargo, no es posible definir una clase CSS B como esa, que luego podría usarse para aplicar estilo a múltiples elementos sin tener que repetir las modificaciones.

Ejemplo

Dada la siguiente hoja de estilo:

p { color : rosa ; }   

Supongamos que hay un elemento p con un elemento de énfasis (<em>) en su interior:

< p > Esto es para < em > ilustrar </ em > la herencia </ p >

Si no se asigna ningún color al elemento em, la palabra resaltada "illustrate" hereda el color del elemento padre, p. La hoja de estilo p tiene el color rosa, por lo tanto, el elemento em también es rosa:

Esto es para ilustrar la herencia.

Espacio en blanco

Se ignora el espacio en blanco entre las propiedades y los selectores. Este fragmento de código:

cuerpo { desbordamiento : oculto ; fondo : #000000 ; imagen de fondo : url ( imagenes/bg.gif ); repetición de fondo : sin repetición ; posición de fondo : arriba a la izquierda ;} 

es funcionalmente equivalente a este:

cuerpo { desbordamiento : oculto ; color de fondo : #000000 ; imagen de fondo : url ( imagenes/bg.gif ); repetición de fondo : sin repetición ; posición de fondo : superior izquierda ; }            

Sangría

Una forma habitual de formatear CSS para facilitar su lectura es sangrar cada propiedad y darle su propia línea. Además de formatear CSS para facilitar su lectura, se pueden utilizar propiedades abreviadas para escribir el código más rápido, lo que también se procesa más rápidamente al renderizarse: [20]

cuerpo { desbordamiento : oculto ; fondo : #000 url ( images/bg.gif ) sin repetición arriba a la izquierda ; }         

A veces, varios valores de propiedad se sangran en su propia línea:

@ font-face { familia-fuente : 'Comic Sans' ; tamaño-fuente : 20px ; src : url ( 'primero.ejemplo.com' ), url ( 'segundo.ejemplo.com' ), url ( 'tercero.ejemplo.com' ), url ( 'cuarto.ejemplo.com' ); }          

Posicionamiento

CSS 2.1 define tres esquemas de posicionamiento:

Flujo normal
Los elementos en línea se disponen de la misma manera que las letras de las palabras del texto, uno tras otro en el espacio disponible hasta que no haya más lugar y luego se inicia una nueva línea debajo. Los elementos en bloque se apilan verticalmente, como los párrafos y como los elementos de una lista con viñetas. El flujo normal también incluye la ubicación relativa de los elementos en bloque o en línea y los cuadros de inserción.
Flotadores
Un elemento flotante se saca del flujo normal y se desplaza hacia la izquierda o la derecha tanto como sea posible en el espacio disponible. Luego, otro contenido fluye junto con el elemento flotante.
Posicionamiento absoluto
Un elemento con posición absoluta no tiene lugar en el flujo normal de otros elementos ni tiene efecto sobre él. Ocupa la posición asignada en su contenedor independientemente de los demás elementos. [21]

Propiedad de posición

Hay cinco valores posibles de la positionpropiedad. Si un elemento se coloca de cualquier forma distinta a , se utilizan staticlas propiedades adicionales top, bottom, lefty para especificar desplazamientos y posiciones. El elemento que tiene una posición estática no se ve afectado por las propiedades , o .righttopbottomleftright

Estático

El valor predeterminado coloca el elemento en el flujo normal .

Relativo

El elemento se coloca en el flujo normal y luego se desplaza o desplaza desde esa posición. Los elementos del flujo subsiguientes se disponen como si el elemento no se hubiera movido.

Absoluto

Especifica el posicionamiento absoluto . El elemento se posiciona en relación con su antecesor no estático más cercano.

Fijado

El elemento se coloca absolutamente en una posición fija en la pantalla incluso mientras se desplaza el resto del documento [21]

Flotar y despejar

La floatpropiedad puede tener uno de tres valores. Los elementos fijos o posicionados de forma absoluta no pueden flotar. Otros elementos normalmente fluyen alrededor de los elementos flotantes, a menos que su propiedad se lo impida .clear

izquierda
El elemento flota a la izquierda de la línea en la que debería haber aparecido; otros elementos pueden fluir alrededor de su lado derecho.
bien
El elemento flota a la derecha de la línea en la que debería haber aparecido; otros elementos pueden fluir alrededor de su lado izquierdo.
claro
Fuerza al elemento a aparecer debajo ('clear') de los elementos flotantes a la izquierda ( ), derecha ( ) o ambos lados ( ). [21] [22]clear:leftclear:rightclear:both

Historia

Håkon Wium Lie , director técnico de la empresa Opera Software y cocreador de los estándares web CSS

CSS fue propuesto por primera vez por Håkon Wium Lie el 10 de octubre de 1994. [23] En ese momento, Lie estaba trabajando con Tim Berners-Lee en el CERN . [24] Varios otros lenguajes de hojas de estilo para la web fueron propuestos al mismo tiempo, y las discusiones en listas de correo públicas y dentro del Consorcio World Wide Web dieron como resultado la primera Recomendación CSS del W3C (CSS1) [25] que se publicó en 1996. En particular, una propuesta de Bert Bos fue influyente; se convirtió en coautor de CSS1, y se lo considera cocreador de CSS. [26]

Las hojas de estilo han existido de una forma u otra desde los comienzos del Lenguaje de marcado generalizado estándar ( SGML ) en la década de 1980, y CSS se desarrolló para proporcionar hojas de estilo para la web. [27] Un requisito para un lenguaje de hojas de estilo web era que las hojas de estilo provenieran de diferentes fuentes en la web. Por lo tanto, los lenguajes de hojas de estilo existentes como DSSSL y FOSI no eran adecuados. CSS, por otro lado, permite que el estilo de un documento se vea influenciado por múltiples hojas de estilo a través de estilos "en cascada". [27]

A medida que el HTML fue creciendo, llegó a abarcar una mayor variedad de capacidades estilísticas para satisfacer las demandas de los desarrolladores web . Esta evolución dio al diseñador más control sobre la apariencia del sitio, a costa de un HTML más complejo. Las variaciones en las implementaciones de navegadores web , como ViolaWWW y WorldWideWeb , [28] dificultaron la apariencia consistente del sitio y los usuarios tenían menos control sobre cómo se mostraba el contenido web. El navegador/editor desarrollado por Tim Berners-Lee tenía hojas de estilo que estaban codificadas en el programa. Por lo tanto, las hojas de estilo no se podían vincular a documentos en la web. [24] Robert Cailliau , también del CERN, quería separar la estructura de la presentación para que diferentes hojas de estilo pudieran describir diferentes presentaciones para impresión, presentaciones basadas en pantalla y editores. [28]

Mejorar las capacidades de presentación web fue un tema de interés para muchos en la comunidad web y se propusieron nueve lenguajes de hojas de estilo diferentes en la lista de correo www-style. [27] De estas nueve propuestas, dos fueron especialmente influyentes en lo que se convirtió en CSS: Cascading HTML Style Sheets [23] y Stream-based Style Sheet Proposal (SSP). [26] [29] Dos navegadores sirvieron como bancos de pruebas para las propuestas iniciales; Lie trabajó con Yves Lafon para implementar CSS en el navegador Arena de Dave Raggett . [30] [31] [32] Bert Bos implementó su propia propuesta de SSP en el navegador Argo . [26] Posteriormente, Lie y Bos trabajaron juntos para desarrollar el estándar CSS (la 'H' se eliminó del nombre porque estas hojas de estilo también se podían aplicar a otros lenguajes de marcado además de HTML). [24]

La propuesta de Lie fue presentada en la conferencia "Mosaic and the Web" (posteriormente llamada WWW2) en Chicago, Illinois en 1994, y nuevamente con Bert Bos en 1995. [24] En esa época el W3C ya se estaba estableciendo y se interesó en el desarrollo de CSS. Organizó un taller con ese fin presidido por Steven Pemberton . Esto dio como resultado que el W3C añadiera trabajo sobre CSS a los entregables del comité de revisión editorial (ERB) de HTML. Lie y Bos fueron el personal técnico principal en este aspecto del proyecto, con miembros adicionales, incluido Thomas Reardon de Microsoft, que también participaron. En agosto de 1996, Netscape Communication Corporation presentó un lenguaje de hojas de estilo alternativo llamado JavaScript Style Sheets (JSSS). [24] La especificación nunca se terminó y está obsoleta. [33] A fines de 1996, CSS estaba listo para convertirse en oficial y la Recomendación CSS nivel 1 se publicó en diciembre.

El desarrollo de HTML, CSS y DOM se había llevado a cabo en un solo grupo, el Comité de Revisión Editorial de HTML (ERB). A principios de 1997, el ERB se dividió en tres grupos de trabajo: el Grupo de Trabajo HTML , presidido por Dan Connolly del W3C; el Grupo de Trabajo DOM, presidido por Lauren Wood de SoftQuad ; y el Grupo de Trabajo CSS , presidido por Chris Lilley del W3C.

El Grupo de Trabajo CSS comenzó a abordar cuestiones que no se habían abordado con el nivel CSS 1, lo que dio como resultado la creación del nivel CSS 2 el 4 de noviembre de 1997. Se publicó como Recomendación del W3C el 12 de mayo de 1998. El nivel CSS 3, que se inició en 1998, todavía está en desarrollo en 2014 .

En 2005, los grupos de trabajo de CSS decidieron aplicar los requisitos de los estándares de forma más estricta. Esto significó que los estándares ya publicados, como CSS 2.1, CSS 3 Selectors y CSS 3 Text, pasaron del nivel de recomendación candidata al de borrador de trabajo.

Dificultad con la adopción

La especificación CSS 1 se completó en 1996. Ese mismo año se lanzó Internet Explorer 3 [24] de Microsoft, que ofrecía un soporte limitado para CSS. IE 4 y Netscape 4.x añadieron más soporte, pero era, por lo general, incompleto y tenía muchos errores que impedían que se adoptara CSS de forma útil. Pasaron más de tres años antes de que algún navegador web lograra una implementación casi completa de la especificación. Internet Explorer 5.0 para Macintosh , que se lanzó en marzo de 2000, fue el primer navegador en tener soporte completo (más del 99 por ciento) para CSS 1, [34] superando a Opera , que había sido el líder desde su introducción del soporte para CSS quince meses antes. Otros navegadores siguieron su ejemplo poco después, y muchos de ellos implementaron además partes de CSS 2.

Sin embargo, incluso cuando los navegadores web posteriores de la "versión 5" comenzaron a ofrecer una implementación bastante completa de CSS, todavía tenían errores en ciertas áreas. Estaban plagados de inconsistencias, errores y otras peculiaridades . Microsoft Internet Explorer 5. x para Windows , a diferencia del muy diferente IE para Macintosh , tenía una implementación defectuosa del modelo de caja CSS , en comparación con los estándares CSS. Tales inconsistencias y variaciones en la compatibilidad de funciones hicieron que fuera difícil para los diseñadores lograr una apariencia consistente en todos los navegadores y plataformas sin el uso de soluciones alternativas denominadas hacks y filtros CSS. Los errores del modelo de caja de Windows de IE eran tan graves que, cuando se lanzó Internet Explorer 6 , Microsoft introdujo un modo compatible con versiones anteriores de interpretación de CSS (" modo peculiaridades ") junto con un "modo estándar" alternativo y corregido. Otros navegadores que no eran de Microsoft también proporcionaban capacidades de cambio de modo. Por lo tanto, se hizo necesario que los autores de archivos HTML se aseguraran de que contuvieran un marcador especial distintivo que indicara que los autores querían que el CSS se interpretara correctamente, de conformidad con los estándares, en lugar de que estuviera destinado al navegador IE5/Windows , que ya hace tiempo que está obsoleto . Sin este marcador, los navegadores web con la capacidad de cambiar de modo "quirks" dimensionarán los objetos en las páginas web como lo haría IE 5 en Windows, en lugar de seguir los estándares CSS.

Los problemas con la adopción irregular de CSS y las erratas en la especificación original llevaron al W3C a revisar los estándares CSS 2 para convertirlos en CSS 2.1, que se acercaba a una instantánea funcional del soporte CSS actual en los navegadores HTML. Se eliminaron algunas propiedades de CSS 2 que ningún navegador había implementado con éxito y, en unos pocos casos, se cambiaron comportamientos definidos para poner el estándar en línea con las implementaciones existentes predominantes. CSS 2.1 se convirtió en una Recomendación candidata el 25 de febrero de 2004, pero CSS 2.1 volvió al estado de Borrador de trabajo el 13 de junio de 2005 [35] y solo volvió al estado de Recomendación candidata el 19 de julio de 2007 [36].

Además de estos problemas, la .cssextensión fue utilizada por un producto de software utilizado para convertir archivos de PowerPoint en archivos de presentación de diapositivas compacta, [37] por lo que algunos servidores web sirvieron todos .css[38] como tipo MIME application/x-pointplus[39] en lugar de text/css.

Prefijos de proveedores

En ocasiones, los proveedores de navegadores individuales introdujeron nuevos parámetros antes de la estandarización y la universalización. Para evitar interferir con las implementaciones futuras, los proveedores antepusieron nombres únicos a los parámetros, como -moz-en el caso de Mozilla Firefox , -webkit-que lleva el nombre del motor de navegación de Apple Safari , -o-en el caso de Opera Browser y -ms-en el de Microsoft Internet Explorer y las primeras versiones de Microsoft Edge que utilizan EdgeHTML.

Ocasionalmente, los parámetros con prefijos de proveedor como -moz-radial-gradienty -webkit-linear-gradienttienen una sintaxis ligeramente diferente en comparación con sus contrapartes sin prefijo de proveedor. [40]

Las propiedades prefijadas quedan obsoletas en el momento de la estandarización. Existen programas que agregan automáticamente prefijos para navegadores más antiguos y que señalan versiones estandarizadas de parámetros prefijados. Dado que los prefijos están limitados a un pequeño subconjunto de navegadores, eliminar el prefijo permite que otros navegadores vean la funcionalidad. Una excepción son ciertas -webkit-propiedades prefijadas obsoletas, que son tan comunes y persistentes en la web que otras familias de navegadores han decidido admitirlas para lograr compatibilidad. [41]

Instantánea CSS 2021

CSS tiene varios niveles y perfiles. Cada nivel de CSS se basa en el anterior, generalmente agregando nuevas características y generalmente se denotan [42] como CSS 1, CSS 2, CSS 3 y CSS 4. Los perfiles son típicamente un subconjunto de uno o más niveles de CSS creados para un dispositivo o interfaz de usuario en particular. Actualmente, existen perfiles para dispositivos móviles, impresoras y televisores. Los perfiles no deben confundirse con los tipos de medios, que se agregaron en CSS 2.

CSS 1

La primera especificación CSS que se convirtió en una recomendación oficial del W3C es CSS nivel 1, publicada el 17 de diciembre de 1996. Håkon Wium Lie y Bert Bos son reconocidos como los desarrolladores originales. [43] [44] Entre sus capacidades se encuentran el soporte para

El W3C ya no mantiene la Recomendación CSS 1. [45]

CSS 2

La especificación CSS nivel 2 fue desarrollada por el W3C y publicada como recomendación en mayo de 1998. Un superconjunto de CSS 1, CSS 2 incluye una serie de nuevas capacidades como posicionamiento absoluto, relativo y fijo de elementos y z-index , el concepto de tipos de medios, soporte para hojas de estilo auditivas (que luego fueron reemplazadas por los módulos de voz CSS 3) [46] y texto bidireccional, y nuevas propiedades de fuente como sombras.

El W3C ya no mantiene la recomendación CSS 2. [47]

CSS 2.1

La revisión 1 del nivel 2 de CSS, a menudo denominada "CSS 2.1", corrige errores en CSS 2, elimina funciones con poco soporte o que no son totalmente interoperables y añade extensiones de navegador ya implementadas a la especificación. Para cumplir con el proceso del W3C para estandarizar especificaciones técnicas, CSS 2.1 estuvo entre el estado de borrador de trabajo y el estado de recomendación candidata durante muchos años. CSS 2.1 se convirtió por primera vez en recomendación candidata el 25 de febrero de 2004, pero volvió a ser borrador de trabajo el 13 de junio de 2005 para una revisión más profunda. Volvió a ser recomendación candidata el 19 de julio de 2007 y luego se actualizó dos veces en 2009. Sin embargo, debido a que se realizaron cambios y aclaraciones, volvió nuevamente al estado de borrador de trabajo de última convocatoria el 7 de diciembre de 2010.

CSS 2.1 pasó a ser Recomendación Propuesta el 12 de abril de 2011. [48] Después de ser revisado por el Comité Asesor del W3C, finalmente se publicó como Recomendación del W3C el 7 de junio de 2011. [49]

Se planeó que CSS 2.1 fuera la primera y última revisión del nivel 2, pero el trabajo de baja prioridad en CSS 2.2 comenzó en 2015.

CSS 3

A diferencia de CSS 2, que es una gran especificación única que define varias características, CSS 3 se divide en varios documentos separados llamados "módulos". Cada módulo agrega nuevas capacidades o amplía las características definidas en CSS 2, preservando la compatibilidad con versiones anteriores. El trabajo en CSS nivel 3 comenzó aproximadamente en la época de la publicación de la recomendación original de CSS 2. Los primeros borradores de CSS 3 se publicaron en junio de 1999. [50]

Debido a la modularización, los diferentes módulos tienen diferente estabilidad y estados. [51]

Algunos módulos tienen el estado de Candidate Recommendation ( CR ) y se consideran moderadamente estables. En la etapa CR , se recomienda que las implementaciones eliminen los prefijos de proveedores. [52]

CSS 4

Jen Simmons analiza el estado de CSS en 2019, mientras  se avanzaba en varios módulos de CSS 4

No existe una única especificación CSS4 integrada, [54] porque la especificación se ha dividido en muchos módulos separados que se nivelan de forma independiente.

Los módulos que se basan en elementos del CSS Nivel 2 comenzaron en el Nivel 3. Algunos de ellos ya han alcanzado el Nivel 4 o ya se están acercando al Nivel 5. Otros módulos que definen una funcionalidad completamente nueva, como Flexbox , [55] han sido designados como Nivel 1 y algunos de ellos se están acercando al Nivel 2.

El grupo de trabajo CSS a veces publica "instantáneas", una colección de módulos completos y partes de otros borradores que se consideran lo suficientemente estables como para que los desarrolladores de navegadores los implementen. Hasta ahora, cinco de estos documentos de "mejores prácticas actuales" se han publicado como notas en 2007, [56] 2010, [57] 2015, [58] 2017, [59] y 2018. [60]

Dado que estas instantáneas de especificaciones están destinadas principalmente a los desarrolladores, ha habido una creciente demanda de un documento de referencia con versiones similares dirigido a los autores, que presentaría el estado de las implementaciones interoperables como se documenta actualmente en sitios como Can I Use... [61] y MDN Web Docs. [62] Se ha establecido un grupo comunitario W3C a principios de 2020 para discutir y definir dicho recurso. [63] El tipo real de control de versiones también es tema de debate, lo que significa que el documento, una vez producido, podría no llamarse "CSS4".

Compatibilidad con navegadores

Cada navegador web utiliza un motor de diseño para representar páginas web, y el soporte para la funcionalidad CSS no es consistente entre ellos. Debido a que los navegadores no analizan CSS a la perfección, se han desarrollado múltiples técnicas de codificación para navegadores específicos con soluciones alternativas (comúnmente conocidas como hacks CSS o filtros CSS). La adopción de nuevas funcionalidades en CSS puede verse obstaculizada por la falta de soporte en los principales navegadores. Por ejemplo, Internet Explorer tardó en agregar soporte para muchas características CSS 3, lo que ralentizó la adopción de esas características y dañó la reputación del navegador entre los desarrolladores. Además, filteren algunas versiones se utilizó una sintaxis propietaria para la propiedad sin prefijo de proveedor. [64] Para garantizar una experiencia consistente para sus usuarios, los desarrolladores web a menudo prueban sus sitios en múltiples sistemas operativos, navegadores y versiones de navegador, lo que aumenta el tiempo de desarrollo y la complejidad. Se han creado herramientas como BrowserStack para reducir la complejidad de mantener estos entornos.

Además de estas herramientas de prueba, muchos sitios mantienen listas de compatibilidad de navegadores para propiedades CSS específicas, incluyendo CanIUse y MDN Web Docs . Además, CSS 3 define consultas de características, que proporcionan una @supportsdirectiva que permitirá a los desarrolladores apuntar a navegadores con soporte para cierta funcionalidad directamente dentro de su CSS. [65] El CSS que no es compatible con navegadores más antiguos también se puede parchear a veces usando polyfills de JavaScript , que son piezas de código JavaScript diseñadas para hacer que los navegadores se comporten de manera consistente. Estas soluciones alternativas, y la necesidad de admitir la funcionalidad de respaldo, pueden agregar complejidad a los proyectos de desarrollo y, en consecuencia, las empresas definen con frecuencia una lista de versiones de navegadores que admitirán y no admitirán.

A medida que los sitios web adoptan estándares de código más nuevos que son incompatibles con navegadores más antiguos, estos navegadores pueden quedar impedidos de acceder a muchos de los recursos de la web (a veces intencionalmente). [66] Muchos de los sitios más populares de Internet no solo se degradan visualmente en navegadores más antiguos debido a la mala compatibilidad con CSS, sino que no funcionan en absoluto, en gran parte debido a la evolución de JavaScript y otras tecnologías web.

Limitaciones

Algunas limitaciones señaladas de las capacidades actuales de CSS incluyen:

No se puede declarar explícitamente un nuevo alcance independientemente de la posición

Las reglas de alcance para propiedades como z-index buscan el elemento padre más cercano con un atributo position: absolute o position: relative. Esta extraña combinación tiene efectos no deseados. Por ejemplo, es imposible evitar declarar un nuevo alcance cuando uno se ve obligado a ajustar la posición de un elemento, lo que impide utilizar el alcance deseado de un elemento padre.

Comportamiento dinámico de pseudoclases no controlable

CSS implementa pseudoclases que permiten un grado de retroalimentación del usuario mediante la aplicación condicional de estilos alternativos. Una pseudoclase CSS, " ", es dinámica (equivalente a "onmouseover" de JavaScript) y tiene potencial para un mal uso (por ejemplo, implementar ventanas emergentes de proximidad del cursor), [67] pero CSS no tiene la capacidad para que un cliente la deshabilite (no hay una propiedad similar a "disable") o limite sus efectos (no hay valores similares a "nochange" para cada propiedad).:hover

No se pueden nombrar reglas

No hay forma de nombrar una regla CSS, lo que permitiría (por ejemplo) que los scripts del lado del cliente hagan referencia a la regla incluso si su selector cambia.

No se pueden incluir estilos de una regla en otra regla

Los estilos CSS a menudo deben duplicarse en varias reglas para lograr el efecto deseado, lo que genera un mantenimiento adicional y requiere pruebas más exhaustivas. Se propusieron algunas características CSS nuevas para resolver esto, pero luego se abandonaron. [68] [69] En cambio, los autores pueden obtener esta capacidad mediante el uso de lenguajes de hojas de estilo más sofisticados que se compilan en CSS, como Sass , Less o Stylus .

No se puede apuntar a un texto específico sin alterar el marcado

Además del pseudoelemento, no se pueden seleccionar rangos específicos de texto sin necesidad de utilizar elementos de marcador de posición.:first-letter

Ventajas

Separación del contenido de la presentación

CSS facilita la publicación de contenido en múltiples formatos de presentación al ajustar los estilos en función de varios parámetros nominales. Estos parámetros incluyen preferencias explícitas del usuario (como temas o tamaño de fuente), compatibilidad con diferentes navegadores web, el tipo de dispositivo utilizado para ver el contenido (por ejemplo, computadora de escritorio, tableta o dispositivo móvil), resoluciones de pantalla, la ubicación geográfica del usuario y muchas otras variables. CSS también permite un diseño responsivo, lo que garantiza que el contenido se adapte dinámicamente a diferentes tamaños y orientaciones de pantalla, lo que mejora la accesibilidad y la experiencia del usuario en una amplia gama de entornos.

Coherencia en todo el sitio

Cuando se utiliza CSS de forma eficaz, en términos de herencia y "cascada", se puede utilizar una hoja de estilo global para afectar y dar estilo a los elementos de todo el sitio. Si surge la situación de que se debe cambiar o ajustar el estilo de los elementos, estos cambios se pueden realizar editando las reglas en la hoja de estilo global. Antes de CSS, este tipo de mantenimiento era más difícil, costoso y requería más tiempo.

Ancho de banda

Una hoja de estilo, interna o externa, especifica el estilo una vez para un rango de elementos HTML seleccionados por classtipo o relación con otros. Esto es mucho más eficiente que repetir la información de estilo en línea para cada aparición del elemento. Una hoja de estilo externa generalmente se almacena en la memoria caché del navegador y, por lo tanto, se puede usar en varias páginas sin tener que volver a cargarla, lo que reduce aún más la transferencia de datos a través de una red.

Reformateo de página

Con un simple cambio de una línea, se puede utilizar una hoja de estilo diferente para la misma página. Esto tiene ventajas en términos de accesibilidad, además de brindar la posibilidad de adaptar una página o sitio a diferentes dispositivos de destino. Además, los dispositivos que no pueden comprender el estilo aún muestran el contenido.

Accesibilidad

Sin CSS, los diseñadores web normalmente deben diseñar sus páginas con técnicas como tablas HTML que dificultan la accesibilidad para usuarios con problemas de visión (ver Diseño web sin tablas#Accesibilidad ).

Normalización

Marcos

Los frameworks CSS son bibliotecas preparadas que tienen como objetivo permitir un estilo más sencillo y compatible con los estándares de las páginas web utilizando el lenguaje de hojas de estilo en cascada. Los frameworks CSS incluyen Blueprint , Bootstrap , Foundation y Materialize. Al igual que las bibliotecas de lenguajes de programación y scripting, los frameworks CSS suelen incorporarse como hojas .css externas a las que se hace referencia en el HTML . Proporcionan una serie de opciones listas para usar para diseñar y maquetar la página web. Aunque muchos de estos frameworks se han publicado, algunos autores los utilizan principalmente para la creación rápida de prototipos o para aprender de ellos, y prefieren "elaborar a mano" CSS que sea apropiado para cada sitio publicado sin la sobrecarga de diseño, mantenimiento y descarga que supone tener muchas características sin utilizar en el estilo del sitio. [70]<head>

Cianotipo

Blueprint es un marco CSS diseñado para reducir el tiempo de desarrollo y garantizar la compatibilidad entre navegadores al trabajar con hojas de estilo en cascada (CSS). También sirve como base para muchas herramientas diseñadas para que el desarrollo de CSS sea más sencillo y accesible para principiantes.

Oreja

Bootstrap (anteriormente Twitter Bootstrap) es un marco CSS gratuito y de código abierto orientado al desarrollo de sitios web front-end responsivos y con prioridad para dispositivos móviles . Contiene plantillas de diseño basadas en HTML , CSS y (opcionalmente) JavaScript para tipografía , formularios , botones , navegación y otros componentes de interfaz.

Base

Foundation es un framework front-end responsivo y gratuito que ofrece una cuadrícula responsiva y componentes de interfaz de usuario HTML y CSS , plantillas y fragmentos de código, que incluyen tipografía, formularios, botones, navegación y otros elementos de interfaz, así como funcionalidad opcional proporcionada por extensiones de JavaScript . Foundation es un proyecto de código abierto y anteriormente lo mantenía ZURB. Desde 2019, Foundation ha sido mantenido por voluntarios. [71]

Metodologías de diseño

A medida que aumenta el tamaño de los recursos CSS utilizados en un proyecto, un equipo de desarrollo a menudo necesita decidir sobre una metodología de diseño común para mantenerlos organizados. Los objetivos son la facilidad de desarrollo, la facilidad de colaboración durante el desarrollo y el rendimiento de las hojas de estilo implementadas en el navegador. Las metodologías populares incluyen OOCSS (CSS orientado a objetos), ACSS (CSS atómico), CSS (hoja de estilo en cascada orgánica), SMACSS (arquitectura escalable y modular para CSS) y BEM (bloque, elemento, modificador). [72]

Véase también

Referencias

  1. ^ "Guía para desarrolladores de CSS". MDN Web Docs . Archivado desde el original el 25 de septiembre de 2015. Consultado el 24 de septiembre de 2015 .
  2. ^ Flanagan, David (18 de abril de 2011). JavaScript: la guía definitiva. Pekín; Farnham: O'Reilly. p. 1. ISBN 978-1-4493-9385-4. OCLC  686709345. JavaScript es parte de la tríada de tecnologías que todos los desarrolladores web deben aprender: HTML para especificar el contenido de las páginas web, CSS para especificar la presentación de las páginas web y JavaScript para especificar el comportamiento de las páginas web.
  3. ^ "¿Qué es CSS?". World Wide Web Consortium. Archivado desde el original el 29 de noviembre de 2010. Consultado el 1 de diciembre de 2010 .
  4. ^ Clark, Scott (23 de julio de 2010). "Aplicaciones móviles basadas en la Web del futuro que utilizan HTML 5, CSS y JavaScript". HTML Goodies . HTMLGoodies. Archivado desde el original el 20 de octubre de 2014 . Consultado el 16 de octubre de 2014 .
  5. ^ "Servicio de validación CSS del W3C". Archivado desde el original el 14 de febrero de 2011. Consultado el 30 de junio de 2012 .
  6. ^ "Especificación CSS2.1 del W3C para pseudoelementos y pseudoclases". World Wide Web Consortium. 7 de junio de 2011. Archivado desde el original el 30 de abril de 2012. Consultado el 30 de abril de 2012 .
  7. ^ "Selectores". Especificación de hojas de estilo en cascada, nivel 2, revisión 1 (CSS 2.1) . W3C. Archivado desde el original el 23 de abril de 2006.
  8. ^ "Selectores Nivel 3". W3C. Archivado desde el original el 3 de junio de 2014. Consultado el 30 de mayo de 2014 .
  9. ^ "Módulo de sintaxis CSS nivel 3". W3C . Archivado desde el original el 1 de octubre de 2023 . Consultado el 1 de octubre de 2023 .
  10. ^ "Especificación CSS2.1 del W3C para conjuntos de reglas, bloques de declaración y selectores". World Wide Web Consortium. 7 de junio de 2011. Archivado desde el original el 28 de marzo de 2008. Consultado el 20 de junio de 2009 .
  11. ^ "Tabla de propiedades completa". W3C. Archivado desde el original el 2014-05-30 . Consultado el 2014-05-30 .
  12. ^ "Índice de propiedades CSS". W3C . Consultado el 9 de agosto de 2020 .
  13. ^ "Color CSS". MDN Web Docs. 5 de abril de 2024. Archivado desde el original el 27 de marzo de 2024. Consultado el 5 de abril de 2024 .
  14. ^ "6.1 Unidades de longitud". Hojas de estilo en cascada, nivel 1. 17 de diciembre de 1996. Archivado desde el original el 14 de junio de 2019. Consultado el 20 de junio de 2019 .
  15. ^ "5. Unidades de distancia: el tipo <length>". Módulo de valores y unidades CSS , nivel 3. 6 de junio de 2019. Archivado desde el original el 7 de junio de 2019. Consultado el 20 de junio de 2019 .
  16. ^ Grupo de trabajo HTML del W3C. «HTML 5. Un vocabulario y API asociadas para HTML y XHTML». Consorcio World Wide Web . Archivado desde el original el 15 de julio de 2014. Consultado el 28 de junio de 2014 .
  17. ^ de Meyer, Eric A. (2006). Hojas de estilo en cascada: la guía definitiva (3.ª ed.). O'Reilly Media, Inc. ISBN 0-596-52733-0Archivado desde el original el 15 de febrero de 2014. Consultado el 16 de febrero de 2014 .
  18. ^ "Asignación de valores de propiedad, cascada y herencia". Archivado desde el original el 11 de junio de 2014. Consultado el 10 de junio de 2014 .
  19. ^ "¿Puede una clase CSS heredar una o más clases distintas?". StackOverflow . Archivado desde el original el 2017-10-14 . Consultado el 2017-09-10 .
  20. ^ "Propiedades de atajo". Tutorial . Desarrolladores de Mozilla. 2017-12-07. Archivado desde el original el 2018-01-30 . Consultado el 2018-01-30 .
  21. ^ abc Bos, Bert; et al. (7 de diciembre de 2010). «9.3 Esquemas de posicionamiento». Especificación de hojas de estilo en cascada de nivel 2, revisión 1 (CSS 2.1) . W3C. Archivado desde el original el 18 de febrero de 2011 . Consultado el 16 de febrero de 2011 .
  22. ^ Holzschlag, Molly E (2005). Introducción a HTML y CSS . Pearson Education, Inc. ISBN 0-13-185586-7.
  23. ^ ab Lie, Hakon W (10 de octubre de 1994). «Cascading HTML style sheets – a proposal» (Propuesta) . CERN. Archivado desde el original el 4 de junio de 2014. Consultado el 25 de mayo de 2014 .
  24. ^ abcdef Lie, Håkon Wium ; Bos, Bert (1999). Hojas de estilo en cascada, diseño para la Web. Addison Wesley. ISBN 0-201-59625-3. Recuperado el 23 de junio de 2010 .
  25. ^ "Hojas de estilo en cascada, nivel 1". Consorcio World Wide Web. Archivado desde el original el 9 de abril de 2014. Consultado el 7 de marzo de 2014 .
  26. ^ abc Bos, Bert (14 de abril de 1995). "Hojas de estilo simples para SGML y HTML en la web". Consorcio World Wide Web. Archivado desde el original el 23 de septiembre de 2009. Consultado el 20 de junio de 2010 .
  27. ^ abc «Hojas de estilo en cascada». Universidad de Oslo. Archivado desde el original el 6 de septiembre de 2006. Consultado el 3 de septiembre de 2014 .
  28. ^ ab Petrie, Charles; Cailliau, Robert (noviembre de 1997). "Entrevista a Robert Cailliau sobre la propuesta de la WWW: "Cómo sucedió realmente"". Instituto de Ingenieros Eléctricos y Electrónicos . Archivado desde el original el 6 de enero de 2011. Consultado el 18 de agosto de 2010 .
  29. ^ Bos, Bert (31 de marzo de 1995). "Propuesta de hoja de estilo basada en flujo". Archivado desde el original el 12 de octubre de 2014. Consultado el 3 de septiembre de 2014 .
  30. ^ Nielsen, Henrik Frystyk (7 de junio de 2002). «Libwww Hackers». Consorcio World Wide Web. Archivado desde el original el 2 de diciembre de 2009. Consultado el 6 de junio de 2010 .
  31. ^ "Yves Lafon". Consorcio World Wide Web. Archivado desde el original el 24 de junio de 2010. Consultado el 17 de junio de 2010 .
  32. ^ "El equipo del W3C: tecnología y sociedad". Consorcio World Wide Web. 18 de julio de 2008. Archivado desde el original el 28 de mayo de 2010. Consultado el 22 de enero de 2011 .
  33. ^ Lou Montulli ; Brendan Eich ; Scott Furman; Donna Converse; Troy Chevalier (22 de agosto de 1996). «Hojas de estilo basadas en JavaScript». W3C. Archivado desde el original el 27 de mayo de 2010. Consultado el 23 de junio de 2010 .
  34. ^ "Software CSS". W3C. Archivado desde el original el 25 de noviembre de 2010. Consultado el 15 de enero de 2011 .
  35. ^ Anne van Kesteren . "CSS 2.1: blog de Anne". Archivado desde el original el 10 de diciembre de 2005 . Consultado el 16 de febrero de 2011 .
  36. ^ "Archivo de noticias del W3C en 2007". World Wide Web Consortium . Archivado desde el original el 28 de junio de 2011. Consultado el 16 de febrero de 2011 .
  37. ^ Nitot, Tristan (18 de marzo de 2002). «Tipo MIME incorrecto para archivos CSS». Centro de desarrolladores de Mozilla . Mozilla . Archivado desde el original el 20 de mayo de 2011. Consultado el 20 de junio de 2010 .
  38. ^ McBride, Don (27 de noviembre de 2009). «Tipos de archivos». Archivado desde el original el 29 de octubre de 2010. Consultado el 20 de junio de 2010 .
  39. ^ "Detalles de la extensión de archivo css". Base de datos de extensiones de archivo. 12 de marzo de 2010. Archivado desde el original el 18 de julio de 2011. Consultado el 20 de junio de 2010 .
  40. ^ Kyrnin, Jennifer (12 de noviembre de 2019). "¿Qué son los prefijos de navegador o de proveedor CSS?". Lifewire . Archivado desde el original el 30 de noviembre de 2020.
  41. ^ "Estándar de compatibilidad". WHATWG . 24 de enero de 2024. Archivado desde el original el 4 de febrero de 2024.
  42. ^ "CSS Snapshot 2023 – 2.4. Niveles CSS". W3C . 7 de diciembre de 2023. Archivado desde el original el 8 de febrero de 2024.
  43. ^ Bos, Bert; Wium Lie, Håkon (1997). Hojas de estilo en cascada: diseño para la Web (1.ª edición impresa). Harlow, Inglaterra; Reading, MA: Addison Wesley Longman. ISBN 0-201-41998-X.
  44. ^ W3C : Hojas de estilo en cascada, nivel 1 Archivado el 9 de febrero de 2011 en Wayback Machine Especificación CSS 1
  45. ^ W3C : Especificación de nivel 1 de hojas de estilo en cascada Archivado el 11 de febrero de 2011 en Wayback Machine Especificación de nivel 1 de CSS
  46. ^ "Hojas de estilo auditivas". W3C. Archivado desde el original el 26 de octubre de 2014. Consultado el 26 de octubre de 2014 .
  47. ^ W3C : Hojas de estilo en cascada, nivel 2 Archivado el 16 de enero de 2011 en Wayback Machine Especificación CSS 2 (recomendación de 1998)
  48. ^ W3C : Hojas de estilo en cascada, nivel 2, revisión 1 Archivado el 9 de noviembre de 2011 en Wayback Machine Especificación CSS 2.1 (Recomendación propuesta por el W3C)
  49. ^ W3C: El estándar de hojas de estilo en cascada presume de una interoperabilidad sin precedentes Archivado el 10 de junio de 2011 en Wayback Machine
  50. ^ Bos, Bert (18 de febrero de 2011). «Descripciones de todas las especificaciones CSS». World Wide Web Consortium . Archivado desde el original el 31 de marzo de 2011. Consultado el 3 de marzo de 2011 .
  51. ^ Bos, Bert (26 de febrero de 2011). «CSS current work». Consorcio World Wide Web . Archivado desde el original el 3 de marzo de 2011. Consultado el 3 de marzo de 2011 .
  52. ^ Etemad, Elika J. (12 de diciembre de 2010). "Cascading Style Sheets (CSS) Snapshot 2010". Consorcio World Wide Web . Archivado desde el original el 16 de marzo de 2011. Consultado el 3 de marzo de 2011 .
  53. ^ "Todas las especificaciones CSS". W3C. 22 de mayo de 2014. Archivado desde el original el 30 de mayo de 2014. Consultado el 30 de mayo de 2014 .
  54. ^ Atkins, Tab Jr. "Unas palabras sobre CSS4". Archivado desde el original el 31 de octubre de 2012. Consultado el 18 de octubre de 2012 .
  55. ^ "Módulo de diseño de caja flexible CSS nivel 1". W3C. 19 de noviembre de 2018. Archivado desde el original el 19 de octubre de 2012. Consultado el 18 de octubre de 2012 .
  56. ^ "Cascading Style Sheets (CSS) Snapshot 2007". 12 de mayo de 2011. Archivado desde el original el 8 de agosto de 2016 . Consultado el 18 de julio de 2016 .
  57. ^ "Cascading Style Sheets (CSS) Snapshot 2010". 12 de mayo de 2011. Archivado desde el original el 16 de marzo de 2011. Consultado el 3 de marzo de 2011 .
  58. ^ "CSS Snapshot 2015". W3C . 13 de octubre de 2015. Archivado desde el original el 27 de enero de 2017 . Consultado el 13 de febrero de 2017 .
  59. ^ "CSS Snapshot 2017". W3C . 31 de enero de 2017. Archivado desde el original el 13 de febrero de 2017 . Consultado el 13 de febrero de 2017 .
  60. ^ "CSS Snapshot 2018". W3C . 22 de enero de 2019. Archivado desde el original el 1 de febrero de 2019 . Consultado el 2 de enero de 2019 .
  61. ^ "CSS". ¿Puedo usar…? Tablas de soporte para HTML5, CSS3, etc. Archivado desde el original el 19 de febrero de 2018. Consultado el 26 de enero de 2019 .
  62. ^ "CSS". MDN Web Docs . 21 de julio de 2023. Archivado desde el original el 26 de noviembre de 2023.
  63. ^ "Convocatoria de participación en el grupo comunitario CSS4". W3C . 24 de febrero de 2020. Archivado desde el original el 10 de febrero de 2023 . Consultado el 27 de febrero de 2020 .
  64. ^ Lazaris, Louis (28 de abril de 2010). «Soluciones CSS3 para Internet Explorer». Smashing Magazine . Archivado desde el original el 12 de octubre de 2016. Consultado el 12 de octubre de 2016 .
  65. ^ Simmons, Jen (17 de agosto de 2016). "Uso de consultas de características en CSS". Mozilla Hacks . Archivado desde el original el 11 de octubre de 2016. Consultado el 12 de octubre de 2016 .
  66. ^ Hutchinson, Lee (2019). "Mirando la Web con Internet Explorer 6, una última vez". Ars Technica . Archivado desde el original el 12 de octubre de 2016. Consultado el 12 de octubre de 2016 .
  67. ^ "Ventanas emergentes con CSS puro". meyerweb.com. Archivado desde el original el 2009-12-09 . Consultado el 2009-11-19 .
  68. ^ Tab Atkins Jr. "Regla de aplicación de CSS". GitHub. Archivado desde el original el 22 de febrero de 2016. Consultado el 27 de febrero de 2016 .
  69. ^ "Por qué abandoné @apply — Completar pestañas".
  70. ^ Cederholm, Dan; Ethan Marcotte (2009). CSS artesanal: más diseño web a prueba de balas. New Riders. pág. 114. ISBN 978-0-321-64338-4Archivado desde el original el 20 de diciembre de 2012 . Consultado el 19 de junio de 2010 .
  71. ^ "¿Está la Fundación Zurb en desarrollo activo?". GitHub . Consultado el 21 de noviembre de 2019 .
  72. ^ Antti, Hiljá. "OOCSS, ACSS, BEM, SMACSS: ¿qué son? ¿Qué debo utilizar?". clubmate.fi . Hiljá. Archivado desde el original el 2 de junio de 2015 . Consultado el 2 de junio de 2015 .

Lectura adicional

Enlaces externos