el cssar
el cssar
Diseño UX, técnicas CSS, accesibilidad y estándares web
Saltar al contenido
  • ¿De qué va el CSSar?

CSS

Definición de CSS

CSS u hoja de estilos en cascada (Cascade Style Sheet) es un lenguaje que, mediante «selectores», define estilos para los elementos de un documento escrito con lenguajes de marcado basados en XML tales como HTML, XHTML o SVG. Dichos selectores representan a los elementos mediante nombres de elementos, clases, atributos, identificadores o incluso pseudoselectores que pueden representar desde un estado del elemento (hover, active, focus, :valid…) a un shadowdom (elemento generado al vuelo por los navegadores para aportar interacción con la página web). También pseudoelementos :before y :after que generarán nuestros propio DOM al vuelo con las características CSS que definamos.

Estructura de una hoja de estilos

Cada selector engloba una serie de reglas y están dispuestos a modo de cascada, es decir de arriba a abajo, lo que determina una jerarquía que permite desambigüar en el supuesto de que las reglas CSS de dos selectores se solapen. Adicionalmente existen otros métodos que permiten a CSS elevar una regla dentro de la jerarquía como es la especificidad de los selectores, pero no es la única.

¿Qué puedo aprender sobre CSS?

En los artículos sobre CSS  aprenderéis a dominar los selectores, su especifidad y muchos otros trucos para dar estilos a vuestras páginas web o documentos HTML. Conoceréis los aspectos más interesantes de CSS3, la última y definitiva versión, del lenguaje de estilos; Aprenderéis a cómo lidiar con las diferentes interpretaciones que hacen los navegadores de las reglas CSS y el soporte que tienen éstas en cada uno de ellos. Resolveremos Bugs, retos de elementos HTML5 a la hora de darles estilos, tendencias de diseño web aplicadas a CSS, alineación, estructuras responsive y sobre todo, cuales son las mejores prácticas para escribir buen código CSS.

Sin duda, un sin fin de conceptos que te ayudarán a convertirte en un profesional de HTML/CSS.

Hay 17 entradas archivadas en CSS (esta es la página 1 de 2).

Navegación de entradas

Neumorphism CSS UI

Aprende a trabajar con Neumorphism en CSS con este completo tutorial que incluye algunos de los elementos más caracterísitcos del diseño neomórfico.

Continue leyendo →
en CSS | enero 15, 2025 | 2,713 Palabras | Comentario

Glassmorphism con Backdrop Filter

Aprende todo lo que tienes que saber de una tendencia con mucha historia que llega a la web gracias a la propiedad backdrop-filter de CSS.

Continue leyendo →
en CSS | diciembre 4, 2022 | 1,044 Palabras | Comentario

Selectores CSS avanzados 4/4 – :is() y :where()

:where() e :is() son dos selectores con idéntica función, que deberían ser ya parte de cualquier nuevo desarrollo que use CSS por las razones que veremos a continuación.

Continue leyendo →
en CSS | julio 10, 2022 | 814 Palabras | Comentario

Selectores avanzados CSS 3/4 – :valid e :invalid

Tutorial para crear una validación de formularios HTML5 usable y accesible con selectores CSS :valid, :invalid, :required, :indeterminate y :out-of-range.

Continue leyendo →
en CSS | febrero 21, 2022 | 1,905 Palabras | Comentario

Webkit scrollbar

Una disección CSS de los pseudo-elementos y pseudo-clases que nos permiten personalizar por completo el scroll en los navegadores Webkit

Continue leyendo →
en CSS | noviembre 7, 2021 | 1,228 Palabras | 6 comentarios

Personalizar el scroll con CSS

Cómo diseñar una barra de scroll multi-navegador con unas pocas líneas CSS. Un artículo sintético pero completo de las técnicas más modernas de personalización del scrollbar.

Continue leyendo →
en CSS | octubre 17, 2021 | 1,569 Palabras | Comentario

Selectores avanzados CSS 2/4 – [attribute]

En este segundo capítulo sobre selectores avanzados vamos a ver el selector de atributo [attribute], su sintaxis, su funcionamiento y cuestiones de especificidad, pero sobre todo su aplicación práctica.

Continue leyendo →
en CSS | agosto 15, 2021 | 2,874 Palabras | Comentario

Ocultar el scroll con CSS – hide scroll

Todas las técnicas para ocultar el scrollbar que necesitas conocer en un breve artículo que te explica con ejemplos como combinar atributos como overflow, scrollbar-width y los pseudoelementos ::-webkit-scrollbar

Continue leyendo →
en CSS | marzo 8, 2021 | 1,380 Palabras | 2 comentarios

Columnas HTML con CSS Columns

Cuando hablamos de columnas HTML podemos estar refiriéndonos a dos cosas: a un column layout de dos o tres columnas o al llamado multi-column layout o sistema de columnas responsive. Este artículo se centra en el último, una técnica de múltiples utilidades que seguro te sorprenderá.

Continue leyendo →
en CSS | diciembre 5, 2020 | 1,368 Palabras | Comentario

Selectores avanzados CSS 1/4 – nth-child()

Tutorial de selectores CSS :nth-child de básico a avanzado y aplicaciones prácticas

Continue leyendo →
en CSS | junio 27, 2020 | 1,202 Palabras | Comentario

Navegación de entradas

Subscríbete al boletín

Etiquetas

accesibilidad buscador compartir contacto CSS CSS3 css columns código estructural diseño e-mail email enlace float formularios HTML funciones CSS href HTML HTML pattern inputmode input type jQuery link marcado semántico morfismo pattern pseudo-clases CSS REGEX responsive scrollbar selectores CSS share slider bar tabla HTML Telegram UCD URL usabilidad validación validación HTML5 web 3.0 web semántica whatsapp xhtml
Independent Publisher potencializado por WordPress

elcssar.com es una obra de Daniel Fernando Abril Franco licenciada como CC BY-NC-ND 4.0