Html 如何使容器中的行垂直居中？

默认情况下，行与顶部对齐

我试着把保证金放在最上面：自动；和边缘底部：自动；但是不起作用。 也垂直对齐：中间对齐；也不起作用

有没有简单的解决办法

谢谢

.container{
背景色：黑色；
高度：100px；
}
.行{
背景色：#fff；
高度：50px；
}

---

设置行和行的宽度和高度

.row {
    margin: 0 auto;
}

基本上是这样。在这个问题中，有各种引导的定心方法。这将特别适用于

容器内
行
的场景。这里有两种不同的方法

// method 1 flexbox
.container-flex {
    display: flex;
    align-items: center;
}

// method 2 translatey
.v-center {
    position: relative;
    transform: translatey(-50%);
    top: 50%;
}

您可以使用flexbox来实现以下目的：

.row {
    display: flex;
    align-items: center;
    justify-content: center;
}



正文

.内部{
高度：200px；
宽度：300px；
背景：橙色；
垂直对齐：中间对齐；
显示：表格单元格；
}

“文本”应垂直对齐。
“显示表格单元格”与“垂直对齐”一起使用。
我认为使用内联元素也应该可以做到这一点。
请向我们展示您的代码。我一直在查看其他解决方案，但它们对引导中的行没有具体说明。这是水平对齐，而不是垂直对齐。在要垂直居中的元素的父元素中使用此选项！工作起来很有魅力！回答得好！：）
<div class="inner">
    <p>
      Text
    </p>
</div>

.inner {
  height: 200px;
  width: 300px;
  background: orange;
  vertical-align: middle;
  display: table-cell;
}