モダンブラウザでサポートされているCSSの疑似クラスを使えば、JavaScriptでフォーム状態を監視することなく、CSSで状態を検知できるようになりました。また、HTMLのpattern属性を使えば入力バリデーション機能（※）もつけられます。これらを活用することで以前よりも手軽にインタラクティブなフォームを実現できます。 デモを別ウインドウで再生する ソースコードを確認する ※あくまでform要素への入力バリデーションなので、送信される値に対して保証はありません。送信される値をチェックするにはサーバー側のバリデーションが別途必要になります。 さまざまな状態を選択できる疑似クラス 疑似クラス（Pseudo-classes）はCSSで使えるセレクターの一種で特定の状態の要素を指定できます。:hoverも疑似クラスの1つです。::afterは「疑似要素」と呼ばれ、表記は似ていますが呼び名が違う
ThumbHash: A very compact representation of an image placeholder
A very compact representation of an image placeholder. Store it inline with your data and show it while the real image is loading for a smoother loading experience. It's similar to BlurHash but with the following advantages: Encodes more detail in the same space Also encodes the aspect ratio Gives more accurate colors Supports images with alpha Despite doing all of these additional things, the cod
https://www.uifiller.com/
We do a lot of rapid prototyping at Cloud Four, which means we’re often working with incomplete or hypothetical content. When it comes to FPO images, we’ve relied on a few different solutions: Third-party services like Placehold and placekitten serve up placeholders based on a URL. You can roll your own image placeholder server using libraries like LIPS or SVG Placeholder. Holder.js uses JavaScrip
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
CSS疑似クラスを活用した、モダンでインタラクティブなフォームの作り方 - ICS MEDIA
Simple Image Placeholders with SVG