0

これは一般的な質問です。レスポンシブでなければならないBootstrapを使用してWebサイトを構築しています。LESS/cssで機能する「標準」手順とは何か知りたいのですが。

まず、標準サイト（デスクトップディスプレイ用）のcssルールを作成しますか？次に、スマートフォンまたはタブレットの特定のルールを適切なLESSファイル（responsive-767px-max.lessなど）に追加しますか？

問題は、デスクトップとスマートフォンのディスプレイに共通しなければならない多くのルールがあることです！次に、これらのルールをすべてのresponsive-xxx.lessファイルにコピーする必要があります。これはあまり快適ではないと思います。たぶん、一般的なルールはbootstrap.less、@ importルールの下に書く必要がありますか？

要するに、私はあなたがこれらのものをどのように管理するか知りたいです。

4

1 に答える 1

1

理論的には、レスポンシブはあなたが説明したものよりもボトムアップです。

  1. まず、CSS と JS のサポートを最小限に抑えた、最低限必要なブラウザーでサイト/アプリが動作することを確認します。
  2. 次に、ブラウザの機能とウィンドウ サイズを大きくする「アイシング」を追加して、そこから構築します。

また、ブレークポイントを使用するだけでなく、ウィンドウのサイズが変更されたときに、サイズ、幅、高さを適切にスケーリングすることも重要です。

実際には、Bootstrap を使用するだけで、上記の機能が得られます。説明したように、特定のコンポーネントを表示または非表示にするために、メディアクエリでいくつかの決定を行う以外に、それほど多くのことを行う必要はありません。

  • レスポンシブ スタイルシートを含める
  • 次のように、コンテナーと行の流動的なバージョンを使用します。

関連する Bootstrap ドキュメントは次のとおりです。

于 2013-03-25T23:00:42.280 に答える