我想使用 Bootstrap 来创建我新设计的宽度为 960px 的模板。但是,我不知道如何自定义 Bootstrap 来调整容器大小,这对我的元素来说太大了。
我有一个想法,但我不确定这样做是否正确。我可以只创建一个新的“custom.css”文档并将 .container 类编辑为 960px 吗?
提前致谢, 理查德。
最佳答案
在 Bootstrap 中,默认情况下:容器类具有媒体查询中指定的以下 max-width
。
@media (min-width: 768px){
.container{
max-width:750px;
}
}
@media (min-width: 992px){
.container{
max-width:970px;
}
}
@media (min-width: 1200px){
.container{
max-width:1170px;
}
}
要覆盖此规则,请将以下规则添加到您的样式表 custom.css
(确保您的样式表 custom.css
在引导样式表 bootstrap.min 之后加载.css
):
@media (min-width: 992px){
.container{
max-width:960px;
}
}
@media (min-width: 1200px){
.container{
max-width:960px;
}
}
如果需要,您也可以更改其他媒体查询规则。
这是 Bootstrap 的默认网格选项列表。
关于css - 将 Bootstrap 自定义为 960px 宽,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40145139/