在Bootstrap中垂直对齐文本

Question

有人可以帮助我吗？如何在响应式网格中垂直居中文本？

<div class="col-md-4">
    <h1>YOU CAN'T</h1>
</div>

Answer 1

问题是你是垂直居中的未知高度的DIV。您可以使用这样的CSS转换：

.v-center {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

演示：http://bootply.com/106258

Answer 2

由于我们没有示例，我可以承认调整margin-top会做到

http://jsfiddle.net/F7rHQ/

h1{
    margin-top: 10px;
}

<强>更新 考虑到font-size：http://jsfiddle.net/zgwnP/

，对第一个选项进行了一些调整

Answer 3

通过垂直对齐，我猜你的意思是居中的文字？如果是这样的话：

<div class="col-md-4">
   <h1 class="text-center">YOU CAN</h1>
</div>

如果您的意思是将文字置于某个部分的中心，我会在不同的媒体查询中指定我的margin-top