前の記事 ≪:綺麗なUIのサイトがサクサク組めるTwitter Bootstrapを使ったjQuery UIテーマ...
次の記事 ≫:2012年1月10日 管理人のブックマーク

CSS3でクールな角丸テーブルを作る例

2012年01月10日-はてなブックマーク

スポンサード リンク
[PR] 英単語を忘却曲線アプリを使って超効率よく記憶する方法
Practical CSS3 tables with rounded corners - RedTeamDesign

CSS3でクールな角丸テーブルを作る例。
ヘッダーにグラデーションをかけつつ角丸なテーブルを作る例です。カーソルを乗せるとハイライトする機能もtransitionによって組み込んであって良い感じです。
HTMLとしては普通のテーブルなのでCSSでここまでカスタマイズできるというのはいいですね



背景をzebraにするデザインも紹介されています。素材として覚えておくと素早く綺麗なテーブルを構築できそうですね




関連エントリ
関連の記事検索:CSS3, 角丸, CSS, テーブル
スポンサード リンク

By.KJ : 2012年01月10日 10:03 livedoor Readerで購読 Twitterに投稿

間違いの指摘をしていただける方はメール、あるいはTwitter/FBでお願いします(クリック)