HTMLcat: 42 trucos nativos de la web que conviene recordar
Small, native web tricks worth remembering
HTMLcat recopila 42 trucos de HTML, CSS y JavaScript que aprovechan funciones nativas de la plataforma, cada uno con un ejemplo y su advertencia. Incluye desde selectores como :has() y @scope hasta la API Popover y View Transitions, con etiquetas de soporte y consejos para probar en navegadores reales y tecnología de asistencia.
HTML, CSS y JavaScript pueden hacer más de lo que recordamos.
- m-s-y
Me encanta cuando entro a un concesionario de coches y puedo leer todo sobre los diferentes coches. Especialmente cuando los coches no están realmente allí. De hecho, ni siquiera hay una foto de un solo coche. Sí, eso es lo mío.
- moontear
Hay algunas buenas descripciones y sugerencias, pero lo que el sitio realmente necesita son ejemplos. Solo mirar el código no me ayuda mucho. Las descripciones también son en su mayoría tan cortas que podrían ser simplemente tooltips en la página de inicio. Toda la premisa de la página es una colección de "trucos web que vale la pena recordar" y no puedo entender qué hace bash (por ejemplo, `du -hd 1 . | sort -hr`) ahí.
- zeroq
Quizás soy solo yo, pero parece una gran pérdida de tiempo (o para ser más positivo, potencial). Solo el primer ejemplo "Tipo de dispositivo en JS". "Un puntero grueso no significa 'móvil', y un puntero fino no garantiza 'escritorio'. Pregunta al navegador sobre las capacidades de entrada en lugar de adivinar el dispositivo por su user agent." const input = { finePointer: matchMedia('(any-pointer: fine)').matches, coarsePointer: matchMedia('(any-pointer: coarse)').matches, canHover: matchMedia('(any-hover: hover)').matches, }; Así que no me dice cómo identificar el tipo de dispositivo. Ni siquiera ejecuta el código para que pueda comparar rápidamente los resultados entre mi móvil y mi escritorio para establecer una línea base.
- apples_oranges
por favor, no ocultéis las barras de desplazamiento :)
- OuterVale
No son realmente 'trucos', sino más bien menciones de varias características de HTML y CSS. Puedes descubrir una variedad similar de cosas (con mucho más detalle disponible de inmediato y muchos ejemplos) simplemente navegando por MDN.