LoginSignup
5
1

More than 5 years have passed since last update.

bootstrap-select のプルダウンの矢印を文字(▼)にする方法

Posted at

概要

bootstrap-select を使ってて、プルダウン横の矢印が小さすぎるので、自分でサイズを指定したい、できたら font-size 指定したいなーと思ったので、やってみた。

環境

項目名 バージョン
bootstrap-select.js v1.2.2
Chrome v59.0.3071.115

やりかた

CSSをいじるだけ。
dropup は使ってないので、無視しています。

css
/* デフォルトの矢印を非表示にする */
.bootstrap-select.btn-group .dropdown-toggle .caret {
    display: none;
}
/* プルダウンの右端に▼を挿入する */
.bootstrap-select.btn-group .btn .filter-option:after {
    content: '▼';
    font-size: 20px;
    float: right;
}
5
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
5
1