编写CSS媒体内容时可以使用Bootstraps列吗?

时间:2015-12-12 14:58:42

标签: html css twitter-bootstrap

所以我的问题是,当我编写CSS时,您可以使用@media然后输入最大和最小宽度,如下所示:

@media (min-width: 0px) and (max-width: 767px) {
#social-icons {
    padding-left: 125px;
    }
}

但是我想知道你是否可以做同样的事情而不是使用像素使用bootstraps列方法,所以它会像(min-width:col-md-3)或类似的东西,这可能吗?

1 个答案:

答案 0 :(得分:0)

是的,你可以!因此,根据引导程序网站,您可以使用网格系统进行媒体查询!

/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */
/* Small devices (tablets, 768px and up) */
@media (min-width: @screen-sm-min) { ... }
/* Medium devices (desktops, 992px and up) */
@media (min-width: @screen-md-min) { ... }
/* Large devices (large desktops, 1200px and up) */
@media (min-width: @screen-lg-min) { ... }
@media (max-width: @screen-xs-max) { ... }
@media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) { ... }
@media (min-width: @screen-md-min) and (max-width: @screen-md-max) { ... }
@media (min-width: @screen-lg-min) { ... }

这是bootstraps网站here.

的CSS页面中的所有代码