html - 从 Bootstrap Accordion 控件中删除边框

Question

下面是要玩的代码:

Bootply

$('.collapse').on('shown.bs.collapse', function() {
    $("span").addClass('glyphicon-chevron-up').removeClass('glyphicon-chevron-down');
  });

$('.collapse').on('hidden.bs.collapse', function() {
    $("span").addClass('glyphicon-chevron-down').removeClass('glyphicon-chevron-up');
  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container">


    <div class="panel-group" id="accordionMessagesSetup">
        <div class="panel panel-default">
            <div class="panel-heading">
                <h4 class="panel-title">
                    <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordionMessagesSetup" href="#collapseMessagesSetup">
                        <span class="glyphicon glyphicon-chevron-up"></span>
                        Message Setup
                    </a>
                </h4>
            </div>
            <div id="collapseMessagesSetup" class="panel-collapse collapse in">
                <div class="container">
                    
                  <p> my content goes here... </p>

                </div>
            </div>
        </div>
    </div>
</div>

我怎样才能去除面板周围的边框，顶部边框除外？我想要顶部边框，而不是左侧、右侧或底部的边框。 对不起，如果它看起来太简单了；我只是整个网络开发堆栈的新手。

Answer 1

利用 border-width属性。

检查此代码中的 CSS:Bootply