CSSグリッドジェネレーター

何をするのか

列数と行数、最小列幅と間隔を選択します。生成された CSS は、グリッドがコンテナに適応するように、repeat() と minmax() を使用します。

レスポンシブな CSS グリッドの列、行、ギャップを視覚的に作成します。

使い方

CSSグリッドジェネレーター の使用方法の短いバージョンを次に示します。

• 列と行を設定する — プレビューには結果のセルが表示されます。
• 最小幅を選択してください — 列は利用可能なスペースを埋めるまで拡張されます。
• CSSをコピーする — 必要に応じて、スタイルシート内のブレークポイントを調整します。

重要な機能

CSSグリッドジェネレーター が得意とすること。

• デバイスからは何も残らない — 作業はブラウザのタブで行われます。このアプリにはアップロード エンドポイントがないため、ファイルやテキストを保存したり、ログに記録したり、当社が閲覧したりすることはできません。
• アップロードの待ち時間なし — サーバーへの往復を完全にスキップします。結果は、ネットワーク速度やキュー サイズではなく、ご使用の CPU によって制限されます。
• 無料、アカウントなし、割り当てなし — サインアップの壁、ウォーターマーク、1 日あたりの制限はありません。オプションのアカウントは、デバイス間でお気に入りとプリセットを保存するためにのみ存在します。