引导程序4中的垂直对齐
html prettyprint-override">
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" rel="stylesheet"/>
<div class="card ">
<img class="img-fluid card-img" src="https://snap-photos.s3.amazonaws.com/img-thumbs/960w/1U2EGZ07GU.jpg" alt="Deer in nature">
<div class="card-img-overlay d-flex">
<div class="mx-auto">
<h4 class="card-title align-middle">Animal Farm</h4>
<h6 class="text align-middle">George Orwell</h6>
<p class="card-text align-middle">Tired of their servitude to man, a group of farm animals revolt and establish their own society...</p>
</div>
</div>
</div>
共有1个答案
只需使用my-auto作为垂直中心...
<div class="card">
<img class="img-fluid card-img" src="https://snap-photos.s3.amazonaws.com/img-thumbs/960w/1U2EGZ07GU.jpg" alt="Deer in nature">
<div class="card-img-overlay d-flex">
<div class="my-auto mx-auto text-center">
<h4 class="card-title">Animal Farm</h4>
<h6 class="text">George Orwell</h6>
<p class="card-text">Tired of their servitude to man, a group of farm animals revolt and establish their own society...</p>
</div>
</div>
</div>
http://codeply.com/go/zqm4anfcxc
align-middle将对display：table或display：inline元素起作用。
-
我需要中心（水平和垂直）我的输入页面的内容。我正在使用Bootstrap 4 beta版，我在BS页面上按指南操作，但它不起作用-https://getbootstrap.com/docs/4.0/layout/grid/ 你能帮我修一下吗？谢谢
-
我试图使用bootstrap 4集中一个面板，我使用了Align-Items-Centre，但我没有成功。我已经添加了h-100，仍然继续在页面顶部的标题。有人知道会出什么问题吗？我在用angular 4和bootstrap `
-
问题内容： 一个简单的问题：如何使用引导程序在一个col中垂直对齐一个col？这里的例子（我想垂直对齐child1a和child1b）： HTML 更新 一些CSS： 问题答案： .parent { display: table; table-layout: fixed; } 防止破坏col- *类的功能。
-
我试图创建一个网页的主横幅旁边的图像标题。我尝试做的一个示例可以在下面找到：https://optimaninja.com/ 我正在使用bootstrap,下面是一些我必须开始的简单初学者代码： 引导代码： 谢谢你的帮助。
-
我试图找到一个解决方案，如何垂直对齐页脚中的两行，这两行用引导网格放置。 我已经尝试为内容制作一个包装器，并应用常规的flexbox解决方案：display:flex；对齐项目：居中。但这会将两行移动到同一行上。 在这里小提琴https://codepen.io/pen/WNNPdxv 超文本标记语言 CSS
-
问题内容： 我有一个页面，其中仅存在表单，并且我希望将表单放置在屏幕的中央。 该对齐表格水平，但我无法弄清楚如何垂直对齐。我已经尝试使用和，但是它不起作用。 我想念什么？ 问题答案： 更新2019 - Bootstrap 4.3.1 有 没有必要 进行 额外的CSS 。Bootstrap中已经包含的内容将起作用。确保表格的容器为 全高 。Bootstrap4现在具有100％高度的类… 垂直中心：