Cometendo crimes de CSS

imagem

O tempo dos truques CSS acabou. Agora é a hora dos Crimes CSS!

Neste cenário atual de provedores de serviços de conteúdo, os usuários muitas vezes estão limitados a se expressar em textos, links e imagens. As regras de sanitização tendem a eliminar HTML, JavaScript e vários atributos.

Serviço de mídia social Co-apresentador permite que os usuários tenham maior liberdade com marcação e estilos embutidos do que normalmente estamos acostumados. Alguns usuários aproveitaram essa liberdade para cometer Crimes CSS! Resultou em recriações criativas de interfaces familiares e jogos interativos usando propriedades de maneiras não convencionais.

Blackle Mori criou uma engenhoca onde puxar uma alça gira lentamente uma série de engrenagens, polias e correntes. Eventualmente, uma abertura se abre para revelar o mascote do site (“eggbug”) e a proclamação “Bom trabalho!”. Eu observei isso nas Ferramentas do Desenvolvedor e é uma combinação incrível de grid, resize, transform e calc(). Acabei adicionando um border para todos <div>s para tentar entender melhor como cada elemento individual se moveu.

Houve situações no passado em que fui impedido de usar o kit de ferramentas completo de HTML, JavaScript e CSS. Houve muitos casos de uso de elementos decorativos Formas CSS para contornar imagens. Eu tenho usado :hover como uma solução alternativa para mouseenter e mouseleave. Eu tenho usado input:checked como um seletor de irmãos para alternar.

Embora os crimes CSS provavelmente não sejam algo que você gostaria de empregar regularmente, devemos adotar experimentos dentro de restrições que possam promover soluções criativas.


Link Direto →

Carimbo de hora:

Mais de Truques CSS