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

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

5
Twitterブートストラップモーダルでエスケープキーのクローズ機能を有効にするにはどうすればよいですか？
メインのドキュメントページでTwitter Bootstrapモーダルの 指示に従い、上記のdata-keyboard="true"構文を使用しましたが、エスケープキーを押してもモーダルウィンドウが閉じません。 他に何か不足していますか？ コード： <a href="#my-modal" data-keyboard="true" data-toggle="modal">Open Modal</a> <div class='modal fade hide' id='my-modal'> <div class='modal-body'> <div>Test</div> </div> </div>
4
Twitterブートストラップ：高さ100％のコンテナー内のdiv
twitterブートストラップ（2）を使用して、ナビゲーションバーのある単純なページを作成し、内部にcontainer高さ100％のdiv（画面の下部）を追加したいと思います。私のcss-fuは錆びており、これを解決することはできません。 シンプルなHTML： <body> <div class="navbar navbar-fixed-top"> <!-- Rest of nav bar chopped from here --> </div> <div class="container fill"> <div id="map"></div> <!-- This one wants to be 100% height --> </div> </body> 現在のCSS： #map { width: 100%; height: 100%; min-height: 100%; } html, body { height: 100%; } .fill { …
8
Bootstrap 4の「.well」に相当するクラスとは
bootstrap-3にはあります .well、灰色の背景色といくつかのパディングを持つ要素の周りに丸い境界線を追加するクラスがあります。 <div class="well">Basic Well</div> しかし、.wellbootstrap-4にはクラスが見つかりませんでした。.wellbootstrap-4に相当するタグはありますか？
8
Twitter Bootstrapでスタイリングを上書きする方法
Twitter Bootstrapのスタイリングを上書きするにはどうすればよいですか？たとえば、私は現在、CSSルール「float：left;」を含む.sidebarクラスを使用しています。代わりに右に行くようにこれを変更するにはどうすればよいですか？私はHAMLとSASSを使用していますが、Web開発は比較的新しいです。
15
ブートストラップポップオーバーがすべての要素の上に表示されない
私はブートストラップサイトで作業しており、2.0からブートストラップ2.2に更新した後、ポップオーバー以外はすべて機能しました。 ポップオーバーは引き続き正常に表示されますが、他のすべての要素の上に表示されるわけではありません。 <div> // this sits on top of the popover. this did not happen before cleaning up scripts. <div> //popover shows on top of this <div> //popover shows on top of this //link here with popover in it. </div> </div> </div> 誰もがポップオーバーの動作が変更された理由、またはどうすればそれを修正できるかについて何か考えがありますか？ありがとう。
25
ASP.NET MVCのHtml.ActionLinkに「アクティブ」クラスを追加する方法
MVCのブートストラップnavbarに「アクティブ」クラスを追加しようとしていますが、次のように記述すると、アクティブクラスが表示されません。 <ul class="nav navbar-nav"> <li>@Html.ActionLink("Home", "Index", "Home", null, new {@class="active"})</li> <li>@Html.ActionLink("About", "About", "Home")</li> <li>@Html.ActionLink("Contact", "Contact", "Home")</li> </ul> これは、正しくフォーマットされたクラスのように見えますが、機能しません。 <a class="active" href="/">Home</a> Bootstrapのドキュメントには、ナビゲーションバーで「a」タグを使用しないように記載されていますが、上記はHtml.ActionLinkにクラスを追加する正しい方法であると私が考える方法です。これを行うことができる別の（きちんとした）方法はありますか？
13
ブートストラップ3：col-lgのみのpull-right
ブートストラップ3の新機能...私のレイアウトでは次のようになっています。 <div class="row"> <div class="col-lg-6 col-md-6">elements 1</div> <div class="col-lg-6 col-md-6"> <div class="pull-right"> elements 2 </div> </div> </div> 'elements 2'がcol-lgよりも小さい画面で正しく整列しないようにしたい つまり、col-lg-6に対してのみクラスを右に引き寄せることになります... どうすればこれを達成できますか？ ここにフィドルがあります：http : //jsfiddle.net/thibs/Y6WPz/ ありがとうございました
7
ブートストラップcssはnavbar navbar-fixed-topの下のコンテナの一部を非表示にします
私はブートストラップでプロジェクトを構築していて、ほとんど問題はありません.Nav-topの下にコンテナーがあります。私の問題は、コンテナーの一部がnav-topヘッダーの下に隠れていることです.top-marginを使用したくないコンテナ。Plsは以下のHTMLを参照して、問題に直面しています <html> <head> <meta name="viewport" content="width=device-width" /> <title>Index</title> <link rel="stylesheet" href="~/stylesheets/bootstrap.css"/> <link rel="stylesheet" href="~/stylesheets/bootstrap-responsive.css"/> </head> <body> <div class="navbar navbar-fixed-top "> <div class="navbar-inner"> <div class="container"> <button data-target=".nav-collapse" data-toggle="collapse" class="btn btn-navbar collapsed" type="button"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <div class="nav-collapse"><ul class="nav" id="navbar"><li ng-class="{active:section=='plunks'}" class="active"><a href="/plunks/trending"><i class="icon-home"></i>Home</a></li><li><a target="_self" href="/edit/"><i class="icon-calendar"></i>General Election …
6
行を組み合わせたブートストラップ（rowspan）
私はテストしています Twitter Bootstrapをしていますが、行のある基本的な足場に行き詰まりました。私はそれらのドキュメントを何度も再訪しましたが、基本的に列内で列をネストできるネスト列を見ることができますが、行を1つに結合する機能を見つけることができず、結合されていない行の隣の列と整列させることができません。 下の写真は、私が達成したいことを示しています。 私が遭遇した唯一の回避策はテーブルを使用することですが、私の考えではテーブルの使用では応答性が機能しないため、このアイデアは好きではありません。 誰かこれにエレガントな解決策がありますか？私が行うほとんどのWebレイアウトには細かいレベルの柔軟性が必要となるので、ここで何か役に立つものをピックアップできればすばらしいでしょう。
13
マップファイルをロードしようとするブートストラップ。それを無効にする方法は？それをする必要がありますか？
私は最近bootsrap3で遊んでいます。ソースからコンパイルし、プロジェクトにdistr jsとcssを含めました。問題は、GH開発ツールで.map.cssファイルを取得しようとしていることです。なぜそうしたいのですか？それを無効にする方法は？無効にする必要がありますか？開発ツールでエラーマークを付けないように、そのマップファイルを追加しました。その後、すべてのスタイルが少ないファイルで定義されているとおりに表示されますが、あまり役に立ちません。
8
Bootstrap 3.0-固定列サイズを含む流動グリッド
ブートストラップの使い方を学んでいます。現在、私はレイアウトをたどっています。Bootstrapはかなりクールですが、私が目にするものはすべて時代遅れのようです。私の人生において、私には理解できない基本的なレイアウトだと思います。私のレイアウトは次のようになります： --------------------------------------------------------------------------- | | | | | | | | | 240px | 160px | All Remaining Width of the Window | | | | | | | | | --------------------------------------------------------------------------| このグリッドは、ウィンドウの高さ全体を占める必要があります。私の理解から、固定幅と流動幅を混合する必要があります。ただし、Bootstrap 3.0には流動性クラスがないようです。たとえそうであったとしても、流体と固定カラムサイズをどのように混合するかわかりません。誰もがBootstrap 3.0でこれを行う方法を知っていますか？
14
ブートストラップ3シェブロンアイコンで表示状態を折りたたむ
Bootstrap 3のJavascriptのサンプルページのCollapseのコアサンプルを使用して、シェブロンアイコンを使用して折りたたみの状態を表示できました。 私はこれを使ってこれを働いています： $('#accordion .accordion-toggle').click(function (e) { var chevState = $(e.target).siblings("i.indicator").toggleClass('glyphicon-chevron-down glyphicon-chevron-up'); $("i.indicator").not(chevState).removeClass("glyphicon-chevron-down").addClass("glyphicon-chevron-up"); }); これは機能しますが（すべてのブラウザで完全にテストされているわけではありません）、これに対するよりエレガントな解決策があるかどうか疑問に思っていますか？ 理想的にはコア関数を使用したいのですが、それを使用して同じ結果を得る方法がわかりません。 $('#accordion').on('hidden.bs.collapse', function () { //do something... }) これがjsfiddleで動作するバージョンです。
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.