我正在使用Bootstrap 3实现内容标签部分，它几乎适用于除移动设备以外的所有分辨率。出于某种原因，仅在移动设备上，默认的活动选项卡是最后一个名为＆＃34; All＆＃34;，但它显示的内容来自第一个选项卡（＆＃34; Popular＆＃34;）。
它适用于iPad或桌面等更大的分辨率。在这种情况下，默认的活动选项卡是第一个名为＆＃34; Popular＆＃34;并且显示的内容是正确的。
你能帮我解决一下这个问题吗？
<section class="solution-tabs section-tabs">
<div class="container no-padding">
<ul class="nav nav-tabs" role="tablist">
<li class="col-sm-3 active"><a href="#tabPopular" role="tab" data-toggle="tab">Popular</a></li>
<li class="col-sm-3"><a href="#tabIndustries" role="tab" data-toggle="tab">Industries</a></li>
<li class="col-sm-3"><a href="#tabTopics" role="tab" data-toggle="tab">Topics</a></li>
<li class="col-sm-3"><a href="#tabAll" role="tab" data-toggle="tab">All</a></li>
</ul>
</div>
<div class="tab-content">
<div class="tab-pane fade in active" id="tabPopular">
<div class="container">
<div class="row">
Popular tab content<br />
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Esse, est quae quo magnam deserunt facere!
</div>
</div>
</div>
<div class="tab-pane fade" id="tabIndustries">
<div class="container">
<div class="row">
Industries tab content<br />
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Animi, corporis obcaecati eos vero aliquam sit?
</div>
</div>
</div>
<div class="tab-pane fade" id="tabTopics">
<div class="container">
Topics tab content<br />
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Possimus ratione iusto officiis sint quaerat totam.
</div>
</div>
<div class="tab-pane fade" id="tabAll">
<div class="container">
<div class="row">
All tab content<br />
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsam, fugit fuga doloremque minima ducimus ratione.
</div>
</div>
</div>
</div>
</section>