如何隐藏面板以获取额外的小型设备，但仍显示面板的内容

Question

我在twitter-bootstrap面板中有ASP控件。 在超小型设备上，我需要隐藏面板但仍然显示ASP控件。如果我在面板上使用hidden-xs类，那么控件也会被隐藏。 有没有办法在不创建重复ASP控件的情况下执行此操作？

<div class="panel panel-default hidden-xs">
    <div class="panel-heading">
        <div class="panel-title">Milestones</div>
    </div>
    <div class="panel-body">
        <asp:TextBox runat="server" ID="ShowMe" CssClass="form-control"/>
        <asp:TextBox runat="server" ID="Etcetera" CssClass="form-control"/>
    </div>
</div>

结果应如下所示＆＃34; sm＆＃34;，＆＃34; md＆＃34;，＆amp; ＆＃34; LG＆＃34;

对于＆＃34; xs＆＃34;

Answer 1

从<div class="panel panel-default hidden-xs">中删除hidden-xs并将其添加到<div class="panel-heading hidden-xs">

然后在面板<div class="panel panel-default hide-paddingAndBorder-xs">中添加另一个类名称，例如“ hide-paddingAndBorder-xs ”，现在您可以像这样添加媒体查询 @media (min-width:786px) { .hide-paddingAndBorder-xs{ /*Style here to remove padding and border*/} }