CSS 犯罪の実行

画像

CSS トリックの時代は終わりました。 今こそCSS犯罪の時です!

現在のコンテンツ サービス プロバイダーの状況では、ユーザーは多くの場合、テキスト、リンク、および画像で自分自身を表現することに制限されています。 サニタイズ ルールは、HTML、JavaScript、およびさまざまな属性を取り除く傾向があります。

ソーシャルメディアサービス 共催 ユーザーは、私たちが通常慣れているよりも、マークアップとインライン スタイルを自由に使用できます。 一部のユーザーは、この自由を利用して CSS 犯罪を犯しています。 プロパティを型にはまらない方法で使用することにより、使い慣れたインターフェイスやインタラクティブなゲームを創造的に再現することができました。

ブラックル・モリが仕掛けを作った ハンドルをゆっくり引くと、一連のギア、プーリー、チェーンが回転します。 最終的に開口部が開き、サイトのマスコット (「eggbug」) と宣言「Good Job!」が現れます。 私は開発者ツールでこれを見つめましたが、それは驚くべき組み合わせです grid, resize, transform, calc(). 私は最終的に追加しました border すべてを <div>個々の要素がどのように移動したかをよりよく理解しようとすることです。

過去に、HTML、JavaScript、および CSS の完全なツールキットの使用が制限された状況がありました。 装飾を使用する例がたくさんあります CSS シェイプ イメージを回避します。 利用した :hover の回避策として mouseenter および mouseleave。 利用した input:checked 兄弟セレクターとして トグル用。

CSS 犯罪はおそらく定期的に採用したいものではありませんが、創造的な解決策を促進できる制約の中で実験を受け入れる必要があります。


ダイレクトリンク→

タイムスタンプ:

より多くの CSSトリック