Question

我正在使用here

中的 bootstrap-select

我得到的选择是： enter image description here
我想要的原始选择是（并且应该得到）：

区别在于背景（虽然它非常微妙）我有一个按钮的感觉，我不想要。我希望它像第二个一样明显。

我如何实现这一目标？

您可以看到 plunkr 演示here

代码如下：

<head>
    <link rel="stylesheet" href="style.css">
    <script src="script.js"></script>

    <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
      <link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.6.5/css/bootstrap-select.css">

    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">

    <!-- Optional theme -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">


    <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.15/angular.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.0-beta.5/angular-animate.min.js"></script>

</head>
<body>
        <h1>Hello Plunker!</h1>
            &nbsp&nbsp&nbsp
        <select class="selectpicker" multiple>
          <option>Mustard</option>
          <option>Ketchup</option>
          <option>Relish</option>
      </select>  

        <script type="text/javascript" src="bootstrap-select.js"></script>
        <!-- Latest compiled and minified JavaScript -->
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js">   </script>
</body>

提前致谢

Answer 1

只需删除可选主题

即可

<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">

see plunkr

bootstrap-select不复制相同的效果

1 个答案: