Html 带文本的Div：厚边框将文本向下推-如何避免？

在中间的单元格中，我想使用较厚的

边框

，以便更容易看到颜色，但我注意到较厚的边框将文本向下推（在这里，我使其更厚以清晰显示）。这种行为是意料之中的吗

.a{
边框：6px实心#000；
高度：30px；
最大高度：30px；
}
.b{
边框：1px实心#000；
高度：30px；
最大高度：30px；
}

abc 1
abc 2
答案是不，不一定。这里有一个例子：


正文{
背景色：#f0；
}
.表格管制{
背景色：#ffffff；
边框：1px实心#000；
填充：0.25em；
边界半径：6px；
最小宽度：3em；
字号：700；
}
.b{
边框颜色：#00b2ff；
边框宽度：5px；
最小宽度：6em；
}

aaa
FDD
8563
您可以在CSS中添加
行高
属性，以垂直对齐内容，尤其是当容器位于容器内部时，例如当内容更靠近南部
边界
时，如果容器的整个
高度
，则可以将
行高
设置为
-20px
确切地说，
20px
但不是必须的，这正是内容的中心，而当内容靠近北部时，则相反



.a{
边框：6px实心#000；
高度：30px；
最大高度：30px；
线高：30px；
}
.b{
边框：1px实心#000；
高度：30px；
最大高度：30px；
线高：30px；
}

abc 1
abc 2
对于任何感兴趣的人来说，导致这种行为的样式如下

*,
*::before,
*::after {
  box-sizing: border-box; // 1
}