RWD に bootstrap3 を使用し、ブレッドクラムをカスタマイズしました。ただし、携帯サイズには収まりません。
レスポンシブにするにはどうすればよいですか？
問題のスクリーンショットを添付。
ありがとう 
8381 次
2 に答える
4
あなたのニーズに合った、bootsnipp のスニペットを作成しました。
http://bootsnipp.com/snippets/featured/responsive-breadcrumbs
このブレッドクラムを次のように構成できます。
- 最後の n 要素のみを表示します。要素が非表示の場合、リストの先頭に楕円が追加されます。
- 各要素の最大サイズを設定します。ラベルが長すぎる場合は、ラベルの後に楕円が追加されます。
ブレークポイントを設定することで、表示する要素の数とさまざまな画面サイズの最大サイズを設定できるため、オーバーフローが発生しないようにすることができます。
于 2014-06-17T07:12:46.477 に答える
1
自分でコーディングする必要があります。特定のコードがなければ、誰も特定の答えを出すことができません。そうは言っても、Bootstrap Web サイトにカスタム コードを追加するためのセットアップ方法は次のとおりです。
少ない使用
まず、新しい .less ファイルを作成します。このファイルが新しいプライマリ スタイル シートになります。そのファイルで、bootstrap.less ファイルをインポートします。そのファイルをコンパイルし、HTML ファイルにリンクします。これで、すべての Bootstrap 変数にアクセスできる、すぐに使用できる Bootstrap CSS の正確なコピーが得られます。
追加を行うには、そのファイルの import ステートメントの下に追加します。したがって、あなたの場合、メディアクエリとブレッドクラム (variables.less にあります) の変数を取得し、小さな画面でブレッドクラムのスタイルをカスタマイズします。
Bootstrap はモバイル ファーストであることに注意してください。つまり、小さい画面では既定のスタイルが適用され、大きい画面では上書きされます。
あまり使わない
少ないものを使用するのが苦手な場合は、これを開始する絶好の機会だと思います. そうは言っても、昔ながらの方法でそれを行いたい場合は、リンクする 2 番目のスタイル シートを作成し、それを Bootstrap シートの下に追加して、コーディングします。
于 2013-11-15T11:31:16.150 に答える