Question

我有一个表单，其中有多个div可用。但是对于移动视图，我想删除右拉类。

有没有办法实现它？

我删除了详细级别的内容，但正如我们可以看到一个类右拉，这对我来说是一个问题。

如果我错过任何其他信息，请告诉我。

<form action="http://localhost:8085/email/email_client_area/" accept-charset="utf-8" id="commission_form" method="POST" name="commission_form">
<div class="col-md-6">
    <div class="col-md-12 main-box">
        <header class='main-box-header clearfix'>
            <h2><b>FILTER</b></h2>
        </header>
    </div>  
</div>  
    <div class="col-md-6 pull-right custom_class_1">
            <div class="col-md-12 main-box">
                <header class='main-box-header clearfix'>
            <h2><b>EMAIL INFORMATION</b></h2>
        </header>
        <div class="main-box-body clearfix">
            <div class="col-md-12"></div>
                <center>
                    <div class="col-md-12 margin-t-20 margin-b-20">
                        <button name="action" type="submit" value="save" id="submit" class="btn btn-success" >Search</button>
                    </div>
                </center>
            </div>
        </div>
    </div>
</div>  
 </form>
 </div>

Answer 1

您可以使用媒体查询设置不同的CSS规则

@media only screen and (max-width: 500px) {
    .pull-right {
        /* override the CSS rules*/
    }
}

使用jQuery删除

if($(window).width() > 500)
   $('#commission_form .pull-right').removeClass('pull-right').addClass('yournewClass')

Answer 2

你应该从这个div中删除class pull-right并添加到样式：

@media(min-width: 768px) { 
  .custom_class_1{
    float: right;
  }
}

您可以将768px更改为其他值

Answer 3

你可以使用JavaScript来做到这一点。

检查窗口的innerWidth。如果小于500，则从类列表中删除该类

if(window.innerWidth<=500){
     document.querySelector(".pull-right").classList.remove(".pull-right");
}

Answer 4

以下是删除类sudo apt-get install qt5-qmake的Jquery解决方案。

＆＃13;

pull-right

＆＃13;

if ($(window).width() > 500) {
    $('.main-box-body .pull-right').addClass('pull-right');
} else {
    $('.main-box-body .pull-right').removeClass('pull-right');
}

＆＃13;

Answer 5

使用Offsetting可以帮助您处理此类情况。在哪里添加了右侧的类更改，其中包含＆＃34; col-sm-6 col-sm-offset-6 custom_class_1＆＃34;

欲了解更多信息，请访问：

http://getbootstrap.com/css/#grid-offsetting

Answer 6

我认为，您可以使用javascript代码获取文档的宽度，然后根据需要添加卸载类。

var doc_width  = document.documentElement.clientWidth;
if (doc_width < 767 ) {
    $("div.main-box-body div.pull-right").removeClass('pull-right');
}

用另一个类替换类

6 个答案: