Bootstrap-媒体查询-屏幕大小

.container{padding:0 15px; margin:0 auto;}
.container:before{
    content: '';
    display: table;/*防止第一个子元素margin-top越界*/
    }
.container:after{
    content:"";
    display:table;/*防止最后個子元素margin-bottom越界*/
    clear:both;/*清楚子元素浮动的影响*/
}

/*超大PC屏幕下的专用样式*/
@media screen and (min-1200px) {
    .container{ 1170px;}
    .my-img{25%}
}
/*中等PC屏幕下的专用样式*/
@media screen and (min-992px) and (max- 1199px) {
    .container{970px;}
    .my-img{25%}
}
/*PAD屏幕下的专用样式*/
@media screen and (min- 768px) and (max-991px ){
    .container{750px;}
    .my-img{50%}
}
/*PHONE屏幕下的专用样式*/
@media screen and (min-767px) {
    .container{ 100%;}
    .my-img{  100%;}
}