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 2 de 2).

Navegación de entradas

Alinear texto verticalmente con css vertical-align y flexbox

Comparamos algunos de los mejores métodos CSS para centrar contenido en vertical usando vertical-align, flexbox y otras técnicas sencillas y vemos cuales son mejor para cada caso.

Continue leyendo →
en CSS | enero 17, 2019 | 2,517 Palabras | 10 comentarios

Partición CSS: word break, word wrap y hyphens

Solución CSS para partir las líneas de texto en web. El método corta las palabras y les añade un guión tras las sílaba de corte, usando graceful degradation para mantener la compatibilidad con todos los navegadores.

Continue leyendo →
en CSS | agosto 25, 2018 | 755 Palabras | Comentario

Menú responsive – Tutorial CSS

En este tutorial vamos a ver un pequeño componente CSS muy útil: un menú responsive de dos niveles compatible con mobile y tablet, sensible a la resolución de las pantallas pero también a su orientación (vertical u horizontal).

Continue leyendo →
en CSS, responsive | agosto 13, 2017 | 2,084 Palabras | 2 comentarios

Tablas responsive paso a paso

Cómo hacer tablas responsive de forma inteligente trasformando el HTML con CSS para modificar la forma en que se representan los datos en dispositivos móviles.

Continue leyendo →
en CSS, UX | diciembre 26, 2014 | 1,504 Palabras | Comentario

Problema float css

Muchos de vosotros conoceréis este problema y las viejas soluciones, como añadir un elemento con clear: both o aplicar un attributo overflow, y habréis sufrido la contrariedad del primero y las inconsistencias del segundo.
Repasaremos algunas soluciones al problema de los float que desbordan su contenedor e indagaremos en la raiz del problema para poder evitarlo en lugar de corregirlo.

Continue leyendo →
en CSS | julio 9, 2009 | 1,418 Palabras | 2 comentarios

Columnas CSS

Actualización: este artículo es anterior al lanzamiento de IE8 pero explica la técnica de «réplica de una tabla» que sigue siendo un método válido y efectivo para montar una estructura table-free de columnas mediante CSS.

Continue leyendo →
en CSS | marzo 29, 2009 | 1,593 Palabras | 4 comentarios

Estructura html

Seguramente muchos ya habréis oí­do hablar de estos términos, pero si habéis llegado hasta aquí­ quizás estéis buscando respuestas a cómo construir una buena estructura HTML, o lo que es lo mismo, escribir código estructural.

Continue leyendo →
en CSS, xhtml | junio 22, 2008 | 679 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