2017-08-09 19 views
1

Jsfiddleリンクは、私はCSSを使用して、それを変更しようとしましたが、それは完璧に動作しませんでしたブートストラップスライダのサイズを変更するにはどうすればよいですか?

https://github.com/seiyria/bootstrap-slider

からブートストラップスライダーを使用しています https://jsfiddle.net/gzp0pcot/

です。

スライダの幅と高さを変更するにはどうすればよいですか?

最終サイズを現在のサイズのほぼ4倍にします。

私は次のCSSコードを変更するインスペクタを使用:私は高さと幅の値を変更する上

.slider.slider-horizontal .slider-track { 
    height: 30px; 
    width: 200%; 
    margin-top: -5px; 
    top: 50%; 
    left: 0; 
} 

、それはサイズが大きくなりますが、200%では意味がないと正常に動作していません。

答えて

1

幅を設定するために間違ったスライダークラスを追加しています。クラス.slider.slider-horizontalにカスタム幅を追加する必要があります。ブートストラップでデフォルトの幅を設定します。次のクラスをフィドルに追加し、幅をpx %またはビューポート単位で表示されます。その値にサイズが大きくなります。

.slider.slider-horizontal{ 
    width:400px; /* sample value - set it as you like*/ 
} 

これが役に立ちます。

1

.slider.slider-horizontal{ 
width:1200px !important; 
} 

はそれが役に立てば幸い次のCSSを使用します。

関連する問題