我的场景是
如果宽度超过 1024 像素,我希望我的应用能够响应。
如果用户正在玩浏览器并且点击了 1024px 标记以下,我希望应用程序无响应并需要水平滚动条。
我尝试将 min-width
放在 body 标签中,它仍然响应低于 1024px。
我该怎么做?
<body style="min-width: 1300px">
<div class="navbar navbar-fixed-top" style="background-color: #f5f5f5">
<div class="row">
<div class="navbar-header col-md-4">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
@Html.ActionLink("Home", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" })
</div>
<div class="col-md-2 text-center">
<b>Hello</b>
</div>
<div class="col-md-2 text-center">
<b>Hello</b>
</div>
<div class="col-md-2 text-center">
<b>Hello</b>
</div>
<div class="col-md-2 text-center">
<b>Hello</b>
</div>
</div>
</div>
@RenderBody()
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@RenderSection("scripts", required: false)
最佳答案
将以下内容添加到您的 body
标记中。
当内容溢出包含它的元素时,溢出自动将滚动条添加到页面。
body {
min-width: 1024px;
overflow: auto;
}
关于css - 非响应式 Bootstrap 设计,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42700076/