web-dev-qa-db-ja.com

twitter bootstrapカルーセルサイズ

私はTwitter Bootstrapを使用して父のWebサイトを作成していますが、1つのことを除いて完了しています。
-カルーセルの幅を狭くする
-カルーセルの中央
-スクロール矢印を画像上に静止したままにします

ソースを確認できるようにウェブサイトがあります

文字通り、CSSを1行ずつ確認し、カルーセルのあらゆる側面を調整してから、ブラウザーでチェックしました。

混乱のもう1つのポイントは、これらの調整の一部がブラウザでテストする場合に効果があることです。 SHIFT+CTRL+R （したがって、notepad ++はGoogleでchromeサーバーまたはホストを使用せずにデスクトップから直接）開きます）、いくつかの厄介な変更を見ましたが、これらの変更はサーバ。

私は.carouselと@imageの調整を提案する他の投稿を見てきましたが、それらも成功せずに試しました。

imagetwitter-bootstrapsizecarousel
22
user2016949

CSSを使用してカルーセルの幅を設定できます。ブロック要素のセンタリングは、margin: 0 autoで行われます。 .carouselのCSSのみを変更し、残りは自動的に正しくスタイル設定されます。

<div id="myCarousel" class="carousel slide" style="width: 400px; margin: 0 auto">
    ...
</div>

this jsfiddle をチェックして、動作することを確認してください。

34
Jasny - Arnold Daniels

IDが「myCarousel」のDIVに「コンテナ」のクラスを追加するだけです。

したがって、この...

<div id="myCarousel" class="carousel slide">

になる...

<div id="myCarousel" class="carousel slide container">
8
Billy Moat