Importante n.º 1: Calendario de Adviento, ajuste de CSS, actualizaciones de la plataforma web y más

Bienvenido a la primera vez ¡Qué es importante!un resumen de las mejores noticias sobre desarrollo web y CSS de las últimas dos semanas. Si tiene poco tiempo (¿quién no?) o no puede perderse nada relacionado con CSS, esto es lo que puede revisar:

• Los mejores artículos sobre CSS/desarrollo web en la web,
• Anuncios interesantes y enlaces de lectura rápida que compartimos,
• Los mejores lanzamientos recientes de Chrome, Firefox y Safari,
• Quizás haya más.

¡Profundicemos más!

Calendario de Adviento HTMHell 2025

Manuel Matuzović creó esta escena bastante infernal (todo por diversión) Calendario de Adviento HTMHell 2025 Consta de 24 artículos centrados en HTML, básicamente uno para cada día hasta Navidad. Obviamente, hemos incluido 16 excelentes artículos y hay 8 más por venir, por lo que definitivamente te sorprenderá. Lo más importante para mí hasta ahora es Artículos sobre comandos de llamadasa partir de esta semana todos los navegadores web admiten esta función, ¡así que todos ganan!

Logotipo de Webkit ::target-text

WebKit escribió algo sobre ::target-text. Me alegro que lo hayan hecho porque nunca había oído hablar de ello. Sunkanmi también tiene un excelente artículo al respecto en CSS-Tricks.. El texto de destino es el texto que los motores de búsqueda a veces resaltan cuando lo envían a una página web, pero nosotros mismos podemos resaltar el texto cuando enviamos enlaces a otras personas. ::target-text Seleccione este texto para que podamos diseñarlo y todos los navegadores web lo admitan. ¿Quién lo diría?

Deje de usar JavaScript para solucionar problemas de CSS

Chizaram Ken nos guía Podemos utilizar las últimas técnicas CSS para reducir la dependencia de JavaScript.y por qué hacemos esto. Dado que CSS evoluciona más rápido que nunca, creo que veremos más artículos como este.

Tenemos un fino control sobre las ligaduras.

@eva.town en Bluesky dice Sería bueno poder establecer reglas de guiones que impidan que palabras como “más claro” se difundan con guiones como “más claro”, pero @knowler.dev señala que podemos, hasta cierto punto. este hyphenate-limit-chars Las propiedades (aún en espera de compatibilidad con Safari) nos permiten especificar el número mínimo preferido de caracteres a cada lado de un guión, lo cual supongo que es suficiente.

¿Qué formato de color debemos utilizar?

@nadyavoynich.com hizo esta preguntapero para ser honesto todavía no lo sé.

Hice algunos comentarios realmente buenos sobre el formato legible por humanos y la profundidad del color, he decidido oklch(). Pero algunas herramientas de diseño de UI ni siquiera son compatibles con HSL, ¿y qué?

Envoltura de CSS 2025 y estado de HTML 2025

Es esa época del año. Hemos hecho nuestro resumen de Spotify, nuestro resumen de PlayStation, nuestro resumen del año de Duolingo: ahora es el momento. Envoltura CSS 2025todas las novedades y mejores cosas que Chrome está haciendo con CSS (y HTML) este año, y El estado de HTML 2025que trata sobre HTML en general.

Conversaciones interesantes, demostraciones divertidas y nuevas funciones del navegador

Si te perdiste alguno de nuestros clic rápidoaquí están los últimos anuncios y enlaces de desarrollo web/CSS que compartimos:

Finalmente, hemos reunido nuestra selección de las mejores funciones CSS y HTML que los navegadores web han ofrecido en las últimas semanas:

• Cromo 143
• Firefox 146
  • contrast-color()que garantiza un contraste de color óptimo entre los dos colores (o al menos una vez que utiliza colores CSS 6)
  • text-decoration-insetpuedes controlar la posición y el tamaño de la decoración del texto.
  • @scopelo que hace que la definición de nuevos contextos de alcance CSS sea una característica básica (y, francamente, lo más destacado para mí). Año)
  • @custom-mediabásicamente un atributo personalizado pero para consultas de medios, actualmente en prueba
• Safari 26.2
  • random() Genera números aleatorios en CSS, pero desafortunadamente aún no se admite en otros lugares.
  • sibling-index() y sibling-count() Obtenga la posición y el número de hermanos por separado (ahora estamos esperando el soporte de Firefox).
  • field-sizing Habilite el cambio de tamaño adaptativo de los campos de entrada (nuevamente, apúrate Firefox).
  • command y commandforahora básico, y mi elección como mejor característica HTML del año, es un atributo HTML para llamar de forma declarativa a ciertos eventos de JavaScript.
  • hidden=until-foundahora también la línea de base, se utiliza para ocultar elementos hasta que se encuentren mediante Buscar en la página.
  • Además, nunca pudimos establecer cursor En un pseudoelemento, p.e. ::before y ::after¡pero afortunadamente ahora podemos!

Recuerda que podrás volver a vernos en dos semanas. ¡Felices vacaciones!