ページの幅960pxを基準にして、設計するグリッドデザイン | コリス
960 Grid Systemは、ページの幅960pxを基準にして、設計するグリッドデザインを紹介しているサイトです。 960 Grid System デモページ 960pxを基準にする理由としては、下記の2つが挙げられています。 最近のモニターは1024x768の解像度をサポートしており、960pxを表示するには十分である。 960という数字は、2, 3, 4, 5, 6, 8, 10, 12, 15, 16, 20, 24, 30, 32, 40, 48, 60, 64, 80, 96, 120, 160, 192, 240, 320, 480と多くの数字で区切ることができ、フレキシブルにグリッドの設計を行える。 デモページでは、左右に10pxのマージンを持ち、カラム間のマージンを20pxにし、60pxをベースに12カラムと、40pxをベースに16カラムの2種類のレイアウトを見ることが
POLAR BEAR BLOG: 「クリーンな水平分割」がウェブデザインの最新流行？
海外の WEB2.0 系サイトのデザインを見ていると、どこかしら似ていると感じることが多いと思います。「カドが丸い」「ロゴが反射している」などなど、これまでも様々な点が指摘されてきましたが、最近のトレンドは「クリーンな水平分割」なんだとか： ■ Analysis of Web 2.0 Design & Layout Trends – Part 1: Clean, Colorful and Horizontally Divided (StyleIgnite.com) 「クリーンな水平分割」とは、StyleIgnite による造語。しかしこの表現がピッタリだということは、例に挙げられているサイトを見れば一目瞭然です： ■ shoeboxed.com 上の画像は、現時点でのキャプチャ。画面全体が大胆に水平分割されていて、余白スペースも大きく開けられていますね。まさしく「クリーンな水平分割」。 念
PHPで画像を雑誌風に自動レイアウトするクラス:phpspot開発日誌
A List Apart: Articles: Automatic Magazine Layout Auto-resized images are a common feature on the web now. Automating the process of resizing images saves a lot of time?it’s certainly quicker than manually resizing images in Photoshop?and is a good way to manage images on a site. But when a good designer crops your images manually, they always looks better. PHPで画像を雑誌風に自動レイアウトするクラスが公開されています。 例えば、次の
intensivstation :: CSS Templates :: Templates
CSS3 & HTML5 TEMPLATES 4 steps to responisve and mobile Blog - Templatedesign 1. HTML5 Blog-Templates(ohne CSS) zeigt die HTML5 Struktur. 2. HTML5 Blog-Templates mit BASIS CSS positioniert. 3. HTML5 Blog-Template RESPONSIVE für mobile Geräte. 4. HTML5 Blog-Template Snow-Style RESPONSIVE. HTML5 Basis Templates (float) 3 Spalten Template zentriert Menus fix, Inhalt dynamisch. 2 Spalten Template zent
ブログでCSSによる段組レイアウトが難しい理由
CSSで2カラムなどの段組レイアウトをやろうとすると、ブログではページ（表示モード）によって左右の段（カラム）の高さが変わるため、なかなか思ったようなレイアウトができません。 たとえば以下のような「典型的」な（しかし実は難しい）レイアウトを実現したいとします。 cfdn_06 hananeko 上のふたつは、サイドバーと記事の領域を「ボーダー」や色で分割し、しかもその境界線がページの最下部まで続くレイアウトの例です。 tableを使えば簡単なこのレイアウトは、CSSでやろうとすると、たいていつまずきます。すわなち、 記事とサイドバーの色分け、あるいはボーダーが最下部まで続かない 段組をfloatでやるにせよ、positionでやるにせよ、背景やボーダーを設定するのはブロックレベル要素（div）なので、divの内容が終わったところで背景色やボーダーが途切れるのは当然です。 All About
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
電脳狂想曲 Webデザインの小技
Little Boxes
