レスポンシブレイアウトを作成するための優秀なグリッドツール集「シリーズ4」_html/css_WEB-ITnose

Web デザイナーと開発者が適切なツールセットを使用し、柔軟なグリッド アーキテクチャに基づいており、デザインにレスポンシブ画像を適用できる場合、レスポンシブ Web サイトの作成は簡単である必要はありません。この記事では、優れたグリッド ツールのリストを紹介します。このリストにないものがあれば、ぜひ共有してください。

Fitgrd

Fitgrd このグリッド システムは、レスポンシブな Web サイトを構築するための強固な基盤です。ラピッド プロトタイピング用に設計されており、実稼働環境でも適切に動作します。このグリッド システムは完璧であり、時間を大幅に節約できます。

レスポンシブ定型文

CSS3 を使用してレスポンシブ Web サイトを実現する軽量のレスポンシブ フレームワークです。このテンプレートには 12 列のグリッドがあり、画像、ビデオ、および主流の流体メディアのあらゆるコンテンツをサポートしています。さらに、ダウンロードには PSD グリッド、Sublime スニペット、および応答性の高いナビゲーション用の JavaScript が含まれています。

Simple Grid

Simple Grid は、Web 開発者向けのグリッド フレームワークです。シンプルなグリッドは 1140 ピクセルのレイアウトを適切にサポートしますが、あらゆるサイズのレイアウトに簡単に適応できます。

レスポンシブ グリッド システム

レスポンシブ グリッド システムは、フレームワークや定型文ではなく、レスポンシブな Web サイトを迅速かつ簡単に作成する方法です。 12、16、または 24 列に制限されるわけではなく、任意の数を指定でき、任意の幅に拡張できます。

Fluid Baseline

Fluid Baseline グリッド システムにはさまざまなリソースが装備されており、HTML5、CSS3 ベースの Web サイトを作成するための開始点となります。タイポグラフィ標準を念頭に置いて構築されており、流動的な列レイアウト、ベース グリッド、モバイル ファーストのレスポンシブ デザイン原則が、解像度やデバイスに依存しないフレームワークに組み合わされています。

Gridpak

Gridpak は Erskine Design によって作成されたレスポンシブ Web デザイン ツールです。

レスポンシブ計算機

は、PSD ピクセル パーフェクトをレスポンシブな Web サイトに変換するのに役立つ単純な計算機です。

Rwd グリッド システム

rwdgrid は、人気の 960grid をベースにしたもう 1 つのグリッド システムであり、応答性が高く、モバイル、タブレット、ラップトップ、および大画面の表示範囲に適しています。このグリッド システムの命名規則は 960 グリッド システムに似ており、アンダースコアがハイフンに置き換えられます (読みやすさを高めるため)。rwdgrid は、1200 ピクセル以上のディスプレイ、960 ピクセル以上のディスプレイ、720 ピクセル以上のディスプレイ、およびモバイル画面システム用に異なるグリッドを備えたグリッドです。

Responsify

Responsify は、独自のレスポンシブ テンプレートを作成できるブラウザベースのツールです。レスポンシブな Web サイトのベースとして使用できます。コンテンツをグリッドに合わせようとするのではなく、コンテンツに合わせてグリッドをカスタマイズできます。