Si siempre has presumido de ser el mejor en el mundo del CSS, ahora es el momento de demostrarlo.
cssbattle.dev es una web que ofrece «batallas» entre programadores de CSS para ver quién consigue hacer lo que piden usando la menor cantidad de código posible.
En la página principal podemos ver algunos de los retos: figruas abstractas o incluso rostros de mostruitos que deben ser diseñados usando CSS directamente desde la plataforma, siendo así también una excelente herramienta para enseñar a programar hojas de estilo viendo el efecto que tiene cada comando.
El objetivo del juego es escribir HTML / CSS para replicar la imagen objetivo dada en el menor código posible. En la página de destino, comenzaremos a codificar en el área del editor a la izquierda. Cuando comencemos a escribir, el área de salida en el medio comenzará a representar el código. Cuando estemos seguros de que la salida coincide con la imagen de destino, presionaremos el botón Enviar para ver la puntuación.
Es importante tener en cuenta que lo que escribimos en el editor se muestra tal como está. No hacen cambios. Esto significa que ni siquiera obtenemos el DOCTYPE. No está permitido usar JavaScript o imágenes en el código. De hecho, no se permite ningún activo externo. Todo el código requerido para generar la imagen de destino debe escribirse solo en el editor dado.
De momento los ocho retos ya han finalizado, pero podemos participar de los cerrados para ir practicando antes de que lancen el siguiente.