Bootstrap, pull-left for small devices

前端 未结 7 761
名媛妹妹
名媛妹妹 2020-12-05 00:31

I\'m building a site in Bootstrap 3. Is there anyway to make a element use the class pull-left on smaller devices and use pull-right on larger ones?

Something like:

7条回答
  •  醉话见心
    2020-12-05 00:52

    LESS version of @Alex's answer

    @media (max-width: @screen-xs-max) {
        .pull-xs-left {
            .pull-left();
        }
    
        .pull-xs-right {
            .pull-right();
        }
    }
    
    @media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
        .pull-sm-left {
            .pull-left();
        }
    
        .pull-sm-right {
            .pull-right();
        }
    }
    
    @media (min-width: @screen-md-min) and (max-width: @screen-md-max) {
        .pull-md-left {
            .pull-left();
        }
    
        .pull-md-right {
            .pull-right();
        }
    }
    
    @media (min-width: @screen-lg-min) {
        .pull-lg-left {
            .pull-left();
        }
    
        .pull-lg-right {
            .pull-right();
        }
    }
    

提交回复
热议问题