关于导航按钮在其他尺寸下显示问题
Posted 南瓜壳
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了关于导航按钮在其他尺寸下显示问题相关的知识,希望对你有一定的参考价值。
关于导航按钮在其他尺寸下显示问题
1.
Bootstrap第4177行
@media (min-width: 768px) {
.navbar-header {
float: left;
}
}
修改为
@media (min-width: 992px) {
.navbar-header {
float: left;
}
}
2.
Bootstrap第4194行
@media (min-width: 768px) {
.navbar-collapse {
width: auto;
border-top: 0;
-webkit-box-shadow: none;
box-shadow: none;
}
.navbar-collapse.collapse {
display: block !important;
height: auto !important;
padding-bottom: 0;
overflow: visible !important;
}
.navbar-collapse.in {
overflow-y: visible;
}
.navbar-fixed-top .navbar-collapse,
.navbar-static-top .navbar-collapse,
.navbar-fixed-bottom .navbar-collapse {
padding-right: 0;
padding-left: 0;
}
}
修改为
media (min-width: 992px) {
.navbar-collapse {
width: auto;
border-top: 0;
-webkit-box-shadow: none;
box-shadow: none;
}
.navbar-collapse.collapse {
display: block !important;
height: auto !important;
padding-bottom: 0;
overflow: visible !important;
}
.navbar-collapse.in {
overflow-y: visible;
}
.navbar-fixed-top .navbar-collapse,
.navbar-static-top .navbar-collapse,
.navbar-fixed-bottom .navbar-collapse {
padding-right: 0;
padding-left: 0;
}
}
3.
Bootstrap第4318行
@media (min-width: 768px) {
.navbar-toggle {
display: none;
}
}
修改为
@media (min-width: 992px) {
.navbar-toggle {
display: none;
}
}
以上是关于关于导航按钮在其他尺寸下显示问题的主要内容,如果未能解决你的问题,请参考以下文章