CSSスニペット：CSSスニペット | かちびと.net

CSS スニペット

Web制作の話題を中心に、便利なWebサービスやリソースなどを紹介
About This

Web制作者向けのTips、チュートリアル、リソース等を自分用のメモとしてほぼ毎日配信しています。たまにWordPressやjQuery、CSSのスニペットのメモも取ります。詳細はAbout me またはhumans.txtに書いてます。

Powered by: WordPress/nginx/css3/html5/jQuery/GA/
Links

レイアウトリストを自動で3列に分ける

テーブル tableで任意の行にマウスホバーしたら他の行をblurさせる

テキスト装飾ノイズが走っているようなエフェクトのテキスト

フォーム回り CSSだけでcheckboxのチェック数をカウントする

小技リンク先の拡張子に合わせてアイコンを表示する

フォーム回りサーチアイコンをクリックすると検索窓がスライド表示する

その他シンプルなタイムライン

小技背景を斜めにする

ナビゲーション矢印型のパンくずナビゲーション

ローディング CSSのみで作られたスピナー集

ボタン box-shadowを利用したボタンのホバーエフェクト集

フォーム回りフォーカスするとlabelが上部に移動しながらテキストが縮小する

小技 CSSだけで要素に自動連番

ボタンボタンの角に印をつけ、マウスホバーで伸びてくるエフェクト

小技見出しでテキストの終わりから先は線にする

ボタンダイヤモンド型のボタン

画像周り画像を背景にした吹き出し

ボタンタグにマウスホバーすると記事数がスライドする

ホバーエフェクト CSSだけでマウスホバーした方向に応じてエフェクトを変える

ローディングテキストとアニメーションでシンプルにローディング中を明示する

ホバーエフェクト四方から囲うように色が変化するボーダー

ホバーエフェクトマウスホバーするとグラデーションの背景と、遅延してテキストが浮かび上がる

<123 4 5 >

Ads

IT・Web業界への転職ならGREEN

CSS Posts

Tools & Resources

Snippets