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

TwitterのBootstrap FrameworkとそのBootstrap Tabs JSを使用しているWebページを開発しています。いくつかのマイナーな問題を除いて、それはうまく機能します。その1つは、外部リンクから特定のタブに直接移動する方法がわからないことです。例えば： <a href="facility.php#home">Home</a> <a href="facility.php#notes">Notes</a> 外部ページからのリンクをクリックすると、それぞれ[ホーム]タブと[メモ]タブに移動します

358 javascript  html  tabs  twitter-bootstrap 

Font Awesomeのアイコンからアイコンの色、サイズ、影をどのようにスタイルできますか？ たとえば、Font Awesomeのサイトでは、いくつかのアイコンは白で表示され、一部は赤で表示さCSSれますが、そのようにスタイルを設定する方法については表示されません...

358 css  twitter-bootstrap  icons  styles  font-awesome-4 

私のサイトでブートストラップを使用していて、navbar固定トップに問題があります。通常のナビゲーションバーを使用している場合は、すべて問題ありません。しかし、navbar fixed topに切り替えようとすると、navbarがなく、navbarがオーバーラップするように、サイト上の他のすべてのコンテンツがシフトアップします。ここに基本的に私がそれをレイアウトした方法があります： .navbar.navbar-fixed-top .navbar-inner .container .container .row //yield content ブートストラップの例を正確にコピーしようとしましたが、navbar fixed topを使用した場合にのみこの問題が発生します。私は何を間違っていますか？

347 html  twitter-bootstrap 

問題： Bootstrap 3でcol-md- *の左右のパディング/マージンを削除します。 HTMLコード： <div class="col-md-12"> <h2>OntoExplorer<span style="color:#b92429">.</span></h2> <div class="col-md-4"> <div class="widget"> <div class="widget-header"> <h3>Dimensions</h3> </div> <div class="widget-content" id=""> <div id='jqxWidget'> <div style="clear:both;margin-bottom:20px;" id="listBoxA"></div> <div style="clear:both;" id="listBoxB"></div> </div> </div> </div> </div> <div class="col-md-8"> <div class="widget"> <div class="widget-header"> <h3>Results</h3> </div> <div class="widget-content"> <div id="map_canvas" style="height: 362px;"></div> </div> </div> </div> </div> …

342 css  twitter-bootstrap  html 

グリフィコンをテキストタイプの入力ボックスに追加するにはどうすればよいですか？たとえば、次のようなユーザー名入力に「icon-user」を含めたいと思います。

340 css  twitter-bootstrap  glyphicons 

ナビゲーションバーのアイテムを右に揃えるにはどうすればよいですか？ ログインして右に登録したいのですが。しかし、私が試みたすべてが機能していないようです。 これは私がこれまでに試したことです： <div>周辺の<ul>属性：style="float: right" <div>周辺の<ul>属性：style="text-align: right" <li>タグでこれら2つのことを試しました !important最後に追加してそれらすべてをもう一度試しました に変更さnav-itemれnav-rightました<li> にpull-sm-rightクラスを追加しました<li> にalign-content-endクラスを追加しました<li> これは私のコードです： <div id="app" class="container"> <nav class="navbar navbar-toggleable-md navbar-light bg-faded"> <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <a class="navbar-brand" href="#">Navbar</a> <ul class="navbar-nav"> <li class="nav-item active"> <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a> </li> <li class="nav-item"> …

340 css  twitter-bootstrap  flexbox  bootstrap-4  navbar 

ブートストラップモーダルでselect2（入力）を使用すると、何も入力できません。それは無効のようなものですか？モーダルの外側ではselect2は正常に動作します。 作業例：http : //jsfiddle.net/byJy8/1/ コード： <!-- Modal --> <div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h3 id="myModalLabel">Panel</h3> </div> <div class="modal-body" style="max-height: 800px"> <form class="form-horizontal"> <!-- Text input--> <div class="control-group"> <label class="control-label" for="vdn_number">Numer</label> <div class="controls"> <!-- seleect2 --> <input name="vdn_number" type="hidden" id="vdn_number" …

338 jquery  twitter-bootstrap  jquery-select2 

containerdivをの内部で垂直方向に中央揃えしjumbotron、ページの中央に設定する方法を探しています。 .jumbotronスクリーンの完全な高さと幅に適合しなければなりません。.containerdivが幅を持っている1025pxし、ページ（縦中央）の真ん中にする必要があります。 このページでは、ジャンボトロンの垂直方向の中央にコンテナーを配置するとともに、ジャンボトロンを画面の高さと幅に適合させます。どうすればそれを達成できますか？ .jumbotron { height:100%; width:100%; } .container { width:1025px; } .jumbotron .container { max-width: 100%; } <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet"/> <div class="jumbotron"> <div class="container text-center"> <h1>The easiest and powerful way</h1> <div class="row"> <div class="col-md-7"> <div class="top-bg"></div> </div> <div class="col-md-5 iPhone-features" style="margin-left:-25px;"> <ul class="top-features"> <li> <span><i class="fa fa-random simple_bg top-features-bg"></i></span> …

333 html  css  twitter-bootstrap  twitter-bootstrap-3  vertical-alignment 

ブートストラップ3はまだRC版ですが、実装しようとしていました。サブメニュークラスの入れ方がわかりませんでした。CSSにはクラスがなく、新しいドキュメントでさえそれについて何も言わない 2.xにはドロップダウンサブメニューとしてクラス名がありました。

324 css  twitter-bootstrap  twitter-bootstrap-3  submenu 

ブートストラップ4を使用して、ページの中央にコンテナーを配置しようとしています。これまでのところ、うまくいきませんでした。任意の助けいただければ幸いです。 私はそれをCodepen.ioで構築したので、皆さんはそれを試してみて、アイデアから私が何をしているのかを教えてください... コードスニペットを表示 var currentAuthor = ""; var currentQuote = ""; function randomQuote() { $.ajax({ url: "https://api.forismatic.com/api/1.0/?", dataType: "jsonp", data: "method=getQuote&format=jsonp&lang=en&jsonp=?", success: function( response ) { $("#quote-content").html('<h2 id="quote-content" class="display-5"><i class="fa fa-quote-left" aria-hidden="true"> ' + response.quoteText + ' <i class="fa fa-quote-right" aria-hidden="true"></i></h2>'); $("#quote-author").html('<p id="quote-author" class="lead"><em>' + response.quoteAuthor + '</em></p>'); currentAuthor = …

322 html  css  twitter-bootstrap  flexbox  bootstrap-4 

私はcssを使用してフッターをフラッシュする手法に一般的に精通しています。 しかし、私はこのアプローチをTwitterブートストラップで機能させるのにいくつかの問題を抱えています。おそらく、Twitterブートストラップが本質的に応答性があるという事実が原因です。Twitterブートストラップを使用すると、上記のブログ投稿で説明されているアプローチを使用して、フッターをページの下部にフラッシュすることができません。

306 css  twitter-bootstrap  footer 

アイテムのブートストラップにナビゲーションバーがある場合 Home | About | Contact 各メニュー項目がアクティブなときに、それらのアクティブクラスをどのように設定しますか？つまりclass="active"、角度ルートが #/ 家のために #/about アバウトページについて #/contact お問い合わせページ

306 javascript  twitter-bootstrap  angularjs  angularjs-directive  navbar 

Bootstrapでボタンと入力がうまく一致しないのはなぜですか？ 私は次のような簡単なことを試しました： <input type="text"/><button class="btn">button</button> ボタンは5px、chrome / firefoxの入力よりも約低いです。

299 css  twitter-bootstrap 

ブートストラップを見ると、小さな画面のメニューバー項目の縮小をサポートしているように見えます。ページの他のアイテムに同様のものはありますか？ たとえば、私は一緒に浮かんでいるナビ錠剤を持っています。小さな画面では、これにより問題が発生します。少なくとも、それを同様のクリックして表示するドロップダウンに配置したいです。 これは既存のBootstrapフレームワーク内で可能ですか？

298 html  css  twitter-bootstrap  responsive-design 

私はこのTwitter Bootstrapコードを持っています <div class='navbar navbar-fixed-top'> <div class='navbar-inner'> <div class='container'> <a class='btn btn-navbar' data-target='.nav-collapse' data-toggle='collapse'> <span class='icon-bar'></span> <span class='icon-bar'></span> <span class='icon-bar'></span> </a> <div class='nav-collapse'> <ul class='nav'> <li class='active'> <a href='some_url'>My Home</a> </li> <li> <a href='some_url'>Option 1 </a> </li> <li> <a href='some_url'>Another option</a> </li> <li> <a href='some_url'>Another option</a> </li> </ul> </div> </div> …

296 css  twitter-bootstrap