問題タブ [bootstrap-4]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
1091 参照

jinja2 - Jinja2 for ループを使用したブートストラップ タブ パネル

jinja2 の for ループでブートストラップ 4 dev タブを動作させようとしています。

私が試しているテストコードは次のとおりです。

ナビゲーション タブは期待どおりに機能し、「1」と「2」の 2 つのタブが表示され、アクティブなクラスが正しく適用されます。

ただし、ナビゲーション タブ間をクリックしてもコンテンツ タブは変わりません。コンテンツ タブは "1" で静的です。

loop.index 条件を loop.index == 2 に変更すると、タブの内容は "2" で静的になります。

ここで何が欠けていますか?

ありがとう。

0 投票する
6 に答える
164194 参照

html - Bootstrap 4 - カード列のレスポンシブ カード

私は Bootstrap 4 で遊んでいますが、divwith でカードに応答性を追加する解決策が見つかりませんclass="card-columns"(このクラスは、このクラスを持つ div 内のカードに Masonry のような効果を適用します)。

Bootstrap 3 では、、 などを含む divに適用できるため、スタイルを設定して「カード」をレスポンシブにするのは簡単でした。class="col-md-3 col-sm-6 col-xs-12"thumbnailcaption

Bootstrap 4 でカードを使用しているときに同じ効果を得るにはどうすればよいですか?

HTMLは次のとおりです。

そして、これが私が使用したCSSです:

以下に、私の状況を明確にするための2つの画像を示します。

大画面

小さい画面

小さい画面でカードを縦に重ねて表示したいです。

ご提案いただきありがとうございます。

0 投票する
1 に答える
2147 参照

css - Bootstrap 4 の固定ナビゲーション バーが本体に重なる

[ほぼ]すべてが に基づいてremsいるため、ナビゲーションバーにはいくつかのファンキーな高さのプロパティがあるようです. 1 つには、ナビゲーションバーの高さは可変ですが、パディングは上下で静的な 8 ピクセルです。

navbar の疑似動的性質の結果として、body の padding-top を 50px に設定するだけでは機能しなくなりました。ユーザーがフォント サイズを変更すると、バーの高さは 50px ではなくなります。

ページの上部までスクロールしたときに、ボディをナビゲーションバーの正確に下に保つために、ボディに適切な量のパディングを与える方法を考え出した人はいますか?

これを達成するためにjQueryを使用しなければならない場合、回帰のように思えますが、おそらくそれが唯一の方法です。

コード例:

一部のフォント サイズではバーが重なっており、他のサイズではギャップがあることに注意してください。Mac OS X では、コマンド + マイナスおよびコマンド + プラスでフォント サイズを変更できます。

編集: ブートストラップ 4 github ページで問題を提起しました。バグは確認されていますが、通常はズーム効果をサポートしていないため、範囲外になる可能性があります。

0 投票する
1 に答える
1250 参照

jquery - jQuery 検証がフォームで機能しないのはなぜですか?

yourTelephoneNumbersフィールドとフィールドyourEmailAddressが検証されていない理由を誰か教えてもらえますか? 基本的に、ユーザーが電話番号またはメールアドレスを入力する必要があるようにフォームを設計しようとしています。

コンソール ログ;

エラー: ブートストラップ ツールチップには Tether が必要です ( http://github.hubspot.com/tether/ ) bootstrap.js:2772:1

TypeError: バリデーターが定義されていません

<head>タグ内のコード;

実際の開発サイト- 「問い合わせる」ボタンをクリック

jsフィドル

0 投票する
1 に答える
2471 参照

twitter-bootstrap-4 - Bootstrap には、公式にコンパイルされたバージョンと一致するセットアップのために、Sass コンパイラと Autoprefixer が必要です。

まったく新しいプロジェクトにブートストラップ 4 を使用したいのですが、混乱しています。

Q: ソースをダウンロードして、次の場所を指すことはできますか?

そして、それは私が心配する必要があるすべてですか?リブート、グリッドのみ、またはフレックスボックスについて心配する必要はありますか? ブートストラップを使いたいだけです。さまざまなオプションや設定についてあまり心配したくありません。

0 投票する
3 に答える
5698 参照

html - Bootstrap v4 でナビゲーション ピルを正当化する

ナビゲーション バーを div の幅全体に揃えたいと考えています。問題は、私が使用Bootstrap v4していて、nav-justifyクラスがまだ利用できないことです。

コードは次のとおりです。

これを行うためにCSSでパーセンテージを使用したくありません。反応のあるものが欲しい。