15

現在の Web プロジェクトに使いやすいグリッド フレームワークが必要です。これらは私が感謝する機能です:

  • 流動的なグリッド レイアウト: 水平方向に (横に並べて) 並べることができ、それぞれが同じ高さ (3 列のレイアウトなど) で、幅 100% で動作するボックス
  • 応答性: ブラウザー ウィンドウのサイズを変更するときに自動的に適応します。
  • モバイル デバイス: パッドと携帯電話用の別のフィッティング レイアウトを示します
  • テキスト サイズ: オプションで、テキスト サイズを動的に調整します (たとえば、全幅の見出し)
  • 画像サイズ: オプションで画像サイズを動的に調整します (たとえば、全幅の画像ギャラリー)
  • breakpoints : 必要に応じて、レイアウトを変更するイベントをトリガーする幅の値を定義します (たとえば、幅がしきい値を下回った場合にボタンを削除するなど)。

アップデート

多くのグリッドを見つけましたが、私の要件に適している可能性がある次の 3 つの有望なフレームワークに絞り込みました。

他のすべては次のとおりです。

通常、ここで質問する前に自分でテストして、より具体的な質問を作成できるようにします。しかし、膨大な量のフレームワークがあるため、どこから始めるべきかについていくつかの指針を聞きたいと思います。

  1. これらまたは他の同様のフレームワークでの経験はどうですか?
  2. 私の要件に合った特定のフレームワークをお勧めしますか?

解決

Foundation私の謙虚な意見では、どちらが明らかにこのレースの勝者であるかを使用することになりました。

更新 2

Bootstrap 3は、セマンティック グリッド クラスもサポートしているため、今では本当の競争相手です。SASS だけでなく LESS もサポートしています。

4

1 に答える 1

1

以前に列を使用しましたが、ブレークポイント機能以外に必要な機能のほとんどを提供します。使いやすく、適応性があります。モバイル画面では、グリッドがスタックに分解されるため、すべての列の内容が上下に表示されます。ただし、ブレークポイント機能で概説したように、インテリジェントな適応機能については、CSS 3 メディア クエリを直接使用することを強くお勧めします。シートの下でこれらの機能を提供する CSS フレームワークは、メディア クエリのみを使用します。

http://twitter.github.com/bootstrap/scaffolding.html#responsiveを見ると、Bootstrap の流動グリッドは、特定の画面サイズの CSS プロパティを設定するための便利なショートカットを提供します。

于 2012-05-26T19:59:44.967 に答える