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

RailsアプリにBootstrap 3.0をインストールしようとしています。最近、Michael Hartlのチュートリアルを終了し、この新しいバージョンのBootstrapを使用して独自のシステムを構築しようとしていますが、不明な点がいくつかあります。 私のシステム仕様： MBP上のOS X Mountain Lion Rails 4.0 Ruby 2.0 私が持っている質問： Gemfileで使用するのに最適なgemは何ですか？それらのいくつかを見つけました。 何をインポートしますcustom.css.scssか？2.3.2とは違うとどこかで読んだことがあります。 Bootstrapを機能させるために他に必要なことはありますか、それとも残りの手順はBootstrap 2.3.2で実行した手順と同じですか？ 編集する ここでは何ですGitHubの上のブートストラップ・レールのプロジェクトが最初に行うことを言います。 gem 'anjlab-bootstrap-rails', :require => 'bootstrap-rails', :github => 'anjlab/bootstrap-rails' 次にそれを行うように言います： gem 'anjlab-bootstrap-rails', '>= 3.0.0.0', :require => 'bootstrap-rails' 彼らは同じことをしますか、それとも両方ともしなければなりませんか？

112 ruby-on-rails  ruby  twitter-bootstrap-3 

モーダルで問題があります。ページ上にモーダルを切り替えるボタンがあります。モーダルが表示されると、ページはトップにジャンプします。 解決策などを見つけるためにできることはすべてやったが、本当に迷っている。 編集： 私も試してみまし$('#myModal').modal('show');たが、まったく同じ効果があります。

110 javascript  jquery  css  twitter-bootstrap  twitter-bootstrap-3 

これは、Bootstrap 3カルーセルで実現しようとしている効果です。 一度に1つのフレームを表示するだけでなく、Nフレームが横にスライドして表示されます。次に、スライドするとき（または自動スライドするとき）、スライドのグループをシフトするように移動します。 これはブートストラップ3のカルーセルで実行できますか？さらに別のjQueryプラグインを探す必要がないことを願っています...

110 jquery  twitter-bootstrap-3  jquery-plugins  carousel  bootstrap-4 

上部固定の動作で使用されるブートストラップ3.0ナビゲーションバーの高さを下げようとしています。ここで私はコードを使用しています。 HTML <div class="tnav"> <div class="navbar navbar-fixed-top" role="banner"> <div class="navbar-inner-sm"> <div class="container"> <div class="navbar-header"> <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-navbar-collapse"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> </div> <nav class="collapse navbar-collapse" role="navigation"> <ul class="nav navbar-nav pull-right"> <li class="active"> <a href="../getting-started">Getting started</a> </li> <li> <a href="../css">Ext01</a> </li> <li> <a …

108 twitter-bootstrap  navbar  twitter-bootstrap-3 

ラベルを入力フィールドの上ではなく、左側に配置したいと思います。 <form method="post" action="" role="form" class="form-inline"> <div class="form-group"> <label for="rg-from">Ab: </label> <input type="text" id="rg-from" name="rg-from" value="" class="form-control"> </div> <div class="form-group"> <label for="rg-to">Bis: </label> <input type="text" id="rg-to" name="rg-to" value="" class="form-control"> </div> <div class="form-group"> <input type="button" value="Clear" class="btn btn-default btn-clear"> <input type="submit" value="Los!" class="btn btn-primary"> </div> </form> このコードは私に与えます： 私はを頂きたい：

104 css  twitter-bootstrap-3 

私はこれを試しましたが間違っています ここにCSSがあります body .modal-ku { width: 750px; } これが失敗した結果です

104 html  css  twitter-bootstrap-3 

私はBootstrapを初めて使用し、古いバージョン2.3.2を使用しています。 バージョン3がリリースされました。最新バージョンを使用したい場合は、CSSファイルとJavascriptファイルを単に置き換えるだけですか？

102 twitter-bootstrap  twitter-bootstrap-3 

私はこのページhttp://www.elmastudio.de/にアクセスしたばかりで、Bootstrap 3で左サイドバーの折りたたみを構築できるかどうか疑問に思いました。 サイドバーを上から折りたたむコード（電話のみ）： <button type="button" class="navbar-toggle sidebar-toggle" data-toggle="collapse" data-target=".sidebar-ex1-collapse"> <span class="sr-only">Sidebar</span> <span class="glyphicon glyphicon-check"></span> </button> サイドバー自体には、hidden-xsクラスがあります。次のjsで削除されます $('.sidebar-toggle').click(function(){ $('#sidebar').removeClass('hidden-xs'); }); ボタンをクリックすると、サイドバーが上から切り替わります。サイドバーが上記のWebサイトのように動作するのを見るのは素晴らしいことです。どんな助けでもありがたいです！

102 twitter-bootstrap-3  bootstrap-4  sidebar  collapse 

tabindexBootstrap 3 の属性は何ですか？ 彼らは実際にすべてのモーダルでそれらを使用していますが、そのドキュメントはそれらについて何も述べていません。 私はそれをその使用に関してのみ見つけました、それは本当にあまり言いません キーボードおよび支援技術ユーザー向けのアクセス可能なツールチップ キーボードで操作するユーザー、特に支援技術のユーザーの場合、リンク、フォームコントロール、またはtabindex = "0"属性を持つ任意の要素などのキーボードフォーカス可能な要素にのみツールチップを追加する必要があります。 そして、属性がでない場合、モーダルを非表示にするように押すことができないことがesctabindex-1わかりました。 escキーを押した後のモーダル終了（tabindexを使用） escキーを押した後にモーダルが閉じない（tabindexなし）

100 twitter-bootstrap  twitter-bootstrap-3  bootstrap-modal 

私Bootstrap 3は、次のようにリンクを区切るためにドロップダウンメニュー内に配置できる水平方向の仕切りがあることを知っています。 <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu2"> <li role="presentation" class="dropdown-header">Dropdown header</li> ... <li role="presentation" class="divider"></li> </ul> 私の質問は次のとおりです。ドロップダウンリストにない状態でこれを行う方法はありますか。

98 twitter-bootstrap  twitter-bootstrap-3 

Bootstrapテーマをv2.3.2からv3.0.0に移行していますが、bootstrap.cssの次のスタイルにより、多くのディメンションが異なる方法で計算されることに気付きました。 *, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } Bootstrapがすべての要素のボックスサイズを境界ボックスに切り替える理由を誰かが説明できますか？新しいグリッドシステムがパーセントベースであることに関係していると思いますが、上のセレクターはグリッド要素にのみ適用されるわけではありません。 少し過激な私見:-) 誰か洞察を与えたいと思う人はいますか？

98 css  twitter-bootstrap  twitter-bootstrap-3  boxsizer 

コンテンツを流動的にしたいの.container-fluidですが、Bootstrapのグリッドで使用すると、まだパディングが表示されます。どうすればパディングを取り除くことができますか？ .rowによるパディングが得られないことがわかりましたが、列を追加したいと思います。そうするとすぐに、パディングが戻ります：O。 全幅で使用できるようにしたい。 例： <div class="container-fluid"> <div class="row"> <div class="col-sm-6"> <p>Use this document as a way to quickly start any new project.<br> All you get is this text and a mostly barebones HTML document.</p> </div> <div class="col-sm-6"> <p>Use this document as a way to quickly start any new project.<br> All …

97 twitter-bootstrap  twitter-bootstrap-3  bootstrap-4 

ブランドカラーに合わせてブートストラップの原色を変更することはできますか？私の場合、bootswatchの紙のテーマを使用しています。

97 css  twitter-bootstrap  twitter-bootstrap-3  bootstrap-4 

Bootstrap 4への移行時に、新しいレスポンシブユーティリティの非表示/表示クラスに問題があります。私は.hidden-クラスがされていることを認識していますV3から取り外して交換して。新しいクラスを使用していますが、要素は表示/非表示に変わりません。理由がわかりません。.hidden-*-up .hidden-*-down.hidden-*-up.hidden-*-down <div class="col hidden-xs-down"> <span class="vcard"> … </span> </div> <div class="col hidden-lg-down"> <div class="hidden-sm-down"> … </div> <div class="hidden-xs-down"> … </div> </div> * 画面サイズに関係なく、この例では何も隠されていません（Safari、レスポンシブデザインモード）

96 twitter-bootstrap  twitter-bootstrap-3  hide  hidden  twitter-bootstrap-4 

<div class="container"> <div class="row" style="padding-top: 240px;"> <a href="#" class="btn btn-large btn-primary" rel="popover" data-content="<form><input type="text"/></form>" data-placement="top" data-original-title="Fill in form">Open form</a> </div> </div> JSfiddle フォームのコンテンツをJavaScript関数内に保存すると思います... ブートストラップポップオーバー内にフォームを含めるにはどうすればよいですか？

95 javascript  jquery  twitter-bootstrap  twitter-bootstrap-3  popover