タグ付けされた質問 「twitter-bootstrap」

Bootstrapは、Webアプリおよびサイトの開発を開始するために設計されたフロントエンドフレームワークです。Bootstrapのバージョンに関連する質問については、「twitter-bootstrap-2」、「twitter-bootstrap-3」、「bootstrap-4」タグから特定のバージョンのタグも使用してください。

12
ブートストラップ4ハンバーガートグルの色を変更
画面サイズが992px未満のときにハンバーガートグラが追加されるブートストラップWebサイトがあります。コードは次のようになります: <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> ハンバーガーのトグルボタンの色を変更する可能性はありますか?


10
ブートストラップ流体レイアウトでグリッド要素を下揃えする方法
Twitterのブートストラップを使用した滑らかなレイアウトで、1つの行に2つの列があります。最初の列には多くのコンテンツが含まれているので、通常はその範囲を満たします。2番目の列にはボタンとテキストがあり、最初の列のセルを基準にして下揃えにしたいのです。 ここに私が持っているものがあります: -row-fluid------------------------------------- +-span6----------+ +-span6----------+ | | |short content | | content | +----------------+ | that | | is tall | | | +----------------+ ----------------------------------------------- ここに私が欲しいものがあります: -row-fluid------------------------------------- +-span6----------+ | | | content | | that | | is tall | +-span6----------+ | | |short content | +----------------+ +----------------+ ----------------------------------------------- 最初のスパンを絶対的な高さにして、2番目のスパンをそれに相対的に配置するソリューションを見てきましたが、divの絶対的な高さを指定する必要がないソリューションが推奨されます。また、同じ効果を達成する方法を完全に再考することにも心がけています。私はこの足場の使用とは結婚していませんが、私にとって最も理にかなっているように見えました。 …


6
ブートストラップテーブルの垂直位置合わせ
4列のテーブルを表示しようとしています。1列は画像です。以下はスナップショットです:- テキストを垂直方向に中央揃えにしたいのですが、CSSが機能しないようです。ブートストラップレスポンシブテーブルを使用しました。私のコードが機能しない理由と、それを機能させるための正しい方法を教えてください。 以下はテーブルのコードです CSS img { height: 150px; width: 200px; } th, td { text-align: center; vertical-align: middle; } HTML <table id="news" class="table table-striped table-responsive"> <thead> <tr> <th>Name</th> <th>Email</th> <th>Phone</th> <th>Photo</th> </tr> </thead> <tbody> <?php $i=0; foreach ($result as $row) { ?> <tr> <td> <?php echo 'Lorem Ispum'; ?> </td> …

24
ブートストラップ3の折りたたまれたメニューがクリックしても閉じない
ブートストラップ3の多かれ少なかれ標準的なナビゲーションがあります <body data-spy="scroll" data-target=".navbar-collapse"> <!-- ---------- Navigation ---------- --> <div class="navbar navbar-fixed-top" role="navigation"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> <span class="sr-only">Toggle navigation</span> </button> <a class="navbar-brand" href="index.html"> <img src="#"></a> </div> <div class="navbar-collapse collapse"> <ul class="nav navbar-nav navbar-right"> <li class="active"><a href="#home">Home</a></li> <li><a href="#one">One</a></li> <li><a href="#two">Two</a></li> <li><a href="#three">Three</a></li> <li><a href="#four">Four</a></li> …

8
ブートストラップ日付ピッカー-月と年のみ
私はブートストラップ日付ピッカーを使用しており、私のコードは次のようです、jsfiddleのコードのデモ <div class="input-append date" id="datepicker" data-date="02-2012" data-date-format="mm-yyyy"> <input type="text" readonly="readonly" name="date" > <span class="add-on"><i class="icon-th"></i></span> </div> $("#datepicker").datepicker({ viewMode: 'years', format: 'mm-yyyy' }); 上記のコードは問題なく機能していますが、私がしようとしているのは、ユーザーが月と年のみを選択できるようにすることです。 その方法を教えて頂けますか?

18
ブートストラップ3:ページの更新時に選択したタブを保持する
Bootstrap 3での更新時に、選択したタブをアクティブにしておこうとしています。試して確認したところ、いくつかの質問はすでにここで尋ねられましたが、私にとっては何の作業もありませんでした。どこが間違っているのかわからない。これが私のコードです HTML <!-- tabs link --> <ul class="nav nav-tabs" id="rowTab"> <li class="active"><a href="#personal-info" data-toggle="tab">Personal Information</a></li> <li><a href="#Employment-info" data-toggle="tab">Employment Information</a></li> <li><a href="#career-path" data-toggle="tab">Career Path</a></li> <li><a href="#warnings" data-toggle="tab">Warning</a></li> </ul> <!-- end: tabs link --> <div class="tab-content"> <div class="tab-pane active" id="personal-info"> tab data here... </div> <div class="tab-pane" id="Employment-info"> tab data here... </div> …

10
ブートストラップのバージョンを特定するにはどうすればよいですか?
サイトのBootstrapを更新したいのですが、インストールされているバージョンがわかりません。 bootstrap.cssファイルとbootstrap.min.jsファイルのみを使用して、ブートストラップのバージョンを特定するにはどうすればよいですか? CSSファイルにはバージョンがなく、min.jsファイルには次のコメントが含まれています。 /*! * Bootstrap.js by @fat & @mdo * Copyright 2012 Twitter, Inc. * http://www.apache.org/licenses/LICENSE-2.0.txt */


4
Bootstrapで利用可能なテキスト色クラス
ナビゲーションバーでタイトルとしてテキストを入力して、サインアップページを開発しています。それらのテキストに異なる色を付けたいです。この目的のために、別のCSSファイルを使用していますが、ブートストラップのCSSファイルを使用してこれを実行したいと考えています。 誰かがブートストラップで利用可能なカラークラスをリストできますか?

3
Bootstrap 3 Slide in Menu / Navbar on Mobile [終了]
閉まっている。この質問にはデバッグの詳細が必要です。現在、回答を受け付けていません。 この質問を改善してみませんか?Stack Overflowのトピックとなるように質問を更新します。 昨年休業。 この質問を改善する 私はブラウザベースのモバイルアプリを構築していて、デザインのcssフレームワークとしてBootstrap 3を使用することにしました。Bootstrap 3の優れた「レスポンシブ」機能はナビゲーションバーにあり、ブラウザの解像度に関する特定の「ブレークポイント」を検出すると自動的に折りたたまれます。多くの状況で機能します。 しかし、最近、多くのブラウザベースのモバイルアプリで、プライマリナビゲーションが画面の左側から非表示になっていることに気づきましたか。右上隅にあるトグルアイコンを押す(トグルする)と、プライマリナビゲーションがスライドして表示されます。画面に入る道の約2/3ですよね?これは、モバイルデバイス上のブラウザーベースのアプリをナビゲートするためのますます人気のあるソリューションであり、理論的には、このバージョンのナビゲーション折りたたみ機能のバージョンに対応するようにブートストラップcss / jsを変更するのはかなり簡単なはずです。 これらの機能はどのように実装できますか?あまり変更を加えるべきではないようです。この件についてのご意見や解決策をぜひお聞かせください。また、Bootstrapを組み込みの機能として実装することは、長期的な解決策になると思います。 残念ながら、私はこれらのテクノロジーに精通している一方で、私は主にPHP / MySQLの開発者であり、これは私が持っていない洞察力を持つ専門家によって構築されるべきであるので、この機能は有用であると信じているため、この機能を作成する試みはしていませんフロントエンド開発者として。


7
ブートストラップカルーセル:自動スライドを削除
ブートストラップカルーセルを使用しています。必要なのは、ナビゲーションまたはページネーションがクリックされたときにのみスライダーがスライドすることです。削除してみました $('.carousel').carousel({ interval: 6000 }); 正常に動作しますが、問題は、ナビゲーションまたはページネーションをクリックした後、自動スライドすることです。オートスライド機能を解除することは可能ですか?もしそうなら、どうですか?

12
Bootstrap 4のドロップダウンで矢印を削除する方法は?
ブートストラップ4を使用しています。ドロップダウンの矢印を削除しようとしました。 答えブートストラップ3はもはや動作しないために私が見つけました。 jsfiddleはこちらです。 <div class="dropdown open"> <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> Dropdown </button> <div class="dropdown-menu" aria-labelledby="dropdownMenu1"> <a class="dropdown-item" href="#">Action</a> <a class="dropdown-item" href="#">Another action</a> </div> </div>

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.