CSSで今までにないグラフをデザインしたい。
そんなときにおすすめなのが、『Pure Css Line Graph』。CSSで折れ線グラフを作るテクニックだ。
このエントリーでは、↑のようなグラフをCSSで実装する方法が紹介されている。
↓のような画像をCSS Spriteとして使用し、dl,ddタグを使って実装している。
デモは以下から。
CSSで折れ線グラフを作るテクニック、チェックして参考にしてみてはいかがだろうか。
Editor's Note
先日フライパンのセットが届いた。いい感じに焼けてるよ。
Related Entry
- CSS3のベンダープレフィクスを自動で追加してくれる「CSSPrefixer」
- Photoshopで作ったようなCSS3のタイポグラフィー
- CSS3で作るクールなお問い合わせフォーム
- floatした画像の横のテキストの回り込みをクリアするCSS
- CSS3を使ったボタンジェネレータ
- CSSだけでJavaScriptのような動きを実装するサンプル30
