CSSでリストを整形するなら覚えておくべき８つのリストデザインサンプル集:phpspot開発日誌

CSSでリストを整形するなら覚えておくべき８つのリストデザインサンプル集。 リストデザインというと、CSSの整形方法によって様々な見せ方が可能ですが、ソースコード＆チュートリアル付きがまとまったエントリが公開されています。 リストデザインの際は、いつも単調になりがち、という方は覚えておくと、ちょっと変わったデザインも作れそうですし、テクニックを駆使してまったく新しいデザインを考えることも出来そう。 それでは以下にそのデザインされたリストのサンプルをご紹介。 1. サイトのナビゲーション風にデザインされたリスト 2. 番号付き＆番号の横に縦のラインがはいった見やすいリスト 3. 矢印画像を使ったリスト 4. iPhoneスタイルのクールなボックスリスト 5. ツリーっぽい形式にできるリストデザイン 6. 複数行にしてテキストっぽく表示できるテキストリスト 7. ワンラインにして、カンマを付与

[coke_kouichi]

css

[whey]

ui, li

[rskmt346]

リストアップデザイン

[n_hikaru]

CSSでリストを整形するなら覚えておくべき８つのリストデザインサンプル集

[milkhoney]

リストをつくる　li

[bigwest]

リスト表示

[Shirokyuma]

あとで読む　Webデザイン　CSS

[runeharst]

リストのデザインサンプル

[nakex1]

リストのCSSによる表示スタイル集

[karimer]

css

[maki2525smile]

使ってみたい(＾ω＾)まとまってるのでありがたい。

[tricot1]

リストのデザインサンプル

[adsty]

ソースコードとチュートリアル付きで公開。

[bigchu]

: 5と7と8がいいね、5. ツリーっぽい形式にできるリストデザイン

[nyati]

CSS

[snb04]

リストのサンプル集

[blauburg]

発作的にレイアウト作り直したくなったときのメンテ性考えると、こういう手法は抑えておきたい

[shiruha]

リスト表示はかっこいいほうがいいですよね

[caraldo_k]

8番面白いな、でもCSS3か・・・うちのブログはまだまだIEユーザーが多いんだけどありかな？？紹介されてるサイトIEで見たらIE完全無視で笑った

[y-kawaz]

分かり易い解説

[sima-box]

CSSでリスト　ソースコード　サンプル