レスポンシブウェブデザインが960.gsのようなCSSグリッドシステムとどのように連携するかについて少し混乱しています。
Nathan Smith（作成者または960.gs）は、しばらく前にAdapt.jsを思いついたのですが、バンドルされているスタイルシート（mobile.css、720.css、960.cssなど）を調べると、グリッドの数が明らかです。列は変更されず、個々の列の幅とそれらが一緒にスタックされる方法のみが変更されます。
一方、 978.gsは別のパターンに従っているようです。
- 300pxグリッドには8列あります
- 748pxと978pxの両方のグリッドには12列あります
- 1218pxと1378pxの両方のグリッドには16列があります
最初はあまり意味がなかったので、開発者に相談しました。彼は、デバイスの幅に応じて異なるCSSと異なるマークアップを提供するのが一般的な方法であると述べて答えました。
このアプローチはまだ少し奇妙に思えます。HTMLマークアップ全体を書き直したい場合は、同じグリッドシステム（たとえば16）を使用し、すべての.grid_{x}クラスを変更して.grid_{x*2}小さな画面に対応することもできます...右？
grid_3Adapt.jsのアプローチは実装と管理が簡単なようですが、いくつかの注意点も見つけることができます。画像またはテキストのスニペットはクラス内にどのようにうまく収まるのでしょうか。その幅は、2520.cssバリアントでもauto、からまでの範囲である可能性がありますか？220px610px
では、レスポンシブWebデザインとグリッドシステムに関する現在のベストプラクティスは何ですか？また、CSSメディアクエリはグリッド（列幅）に影響を与える必要がありますか？現状では、単一のマークアップとスタイルシートを提供し、ブラウザにレンダリング/スケーリングを行わせるのが最善のアプローチであると私は信じる傾向があります。
私はこれでかなりグリーンなので、どんな助けでもありがたいです-ありがとう。