Bootstrap 3 高度自动适应屏幕
时间: 2023-08-02 13:37:28 浏览: 456
漂亮扁平化自适应bootstrap后台html模板
3星 · 编辑精心推荐
在 Bootstrap 3 中,如果要使元素的高度自动适应屏幕的高度,可以使用 CSS3 中的 `vh` 单位。`vh` 表示视口高度的百分之几,例如 `100vh` 表示视口的高度。
因此,我们可以将某个元素的高度设置为 `100vh`,这样该元素的高度就会自动适应屏幕的高度。例如:
```html
<div style="height: 100vh;">
<!-- 内容 -->
</div>
```
在上面的例子中,我们将一个 `div` 元素的高度设置为 `100vh`,这样该元素的高度就会自动适应屏幕的高度,从而实现了高度自动适应屏幕的效果。
需要注意的是,使用 `vh` 单位来设置高度可能会对布局产生一定的影响,因此在使用时需要谨慎。同时,在 Bootstrap 4 中,推荐使用 Flexbox 来实现高度自动适应屏幕。
阅读全文