我希望我的页面内容占据屏幕的整个宽度,左右都有一点填充并且是流畅的,但是当我包装我的 div.row
时和 div.col-md-x
在 <div class="container-fluid">
页面的内容触及屏幕的两侧。
<link href="css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container-fluid">
<div class="row">
<div class="col-md-6">
拥有
100% width
的正确引导方式是什么? ,流畅的布局,以及左右各 15px 的内边距?
最佳答案
根据 Bootstrap docs :
Use .container-fluid for a full width container, spanning the entire width of your viewport.
如果你想要 15px 填充然后添加到你的 CSS:
.container-fluid {
padding: 15px;
}
但是,您可能希望使用百分比(
padding: 2%
)或媒体查询,因为 15px
在不同的屏幕分辨率下看起来会有所不同。另一种选择:使用
<div class="container">
而不是 <div class="container-fluid">
.这将为您提供内置填充。Bootply demo
关于twitter-bootstrap-3 - 使用 Bootstrap 3 的容器流体和侧边填充,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25344168/