Question

我已经对此进行了研究，并尝试了所有解决方案，但是文本并未垂直对齐。

html：

private void AddUniqueNumber()
{  
   Random r = new Random();
   List<int> uniqueList = new List<int>();
   int num = 0, count = 10;
   for (int i = 0; i < count; i++)
   {
       num = r.Next(count);

       if (!uniqueList.Contains(num))
          uniqueList.Add(num);
   }
}

Or:

int[] x = new int[10];
Random r1 = new Random();
int num = 0;
for (int i = 0; i < x.Length; i++)
{
    num = r1.Next(10);
    x[num] = num;
}

css：

<a>משטרה</a>

如果使用 ctrl + shift + c 检查标签，您会看到文本与标签底部对齐，而不是在标签的正中间

Answer 1

如果您尝试将文本垂直居中对齐，则可以采用多种方法。

一种方法是像这样使用绝对定位（不适用于Bootstrap列）：

.parent-class {
  position: relative;
}

.parent-class a {
  position: absolute;
  top: 50%;
  width: 100%;
  transform: translateY(-50%);
}

在您的HTML中：

<div class="parent-class">
  <a>משטרה</a>
</div>

如果您使用的是Flexbox，那么您所需要做的就是在CSS中：

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

在您的HTML中：

<a class="flexbox">משטרה</a>

Answer 2

除非指定高度，否则文本应始终垂直对齐。

a {
  font-size: 2rem;
  border: 2px solid black;
  padding: 20px;
  display: flex;
  align-items: center;
  vertical-align: middle;
  background-color: red;
}

<a>משטרה</a>

如果您确实指定了高度，则flexbox应该为您完成所有操作。破坏代码的地方是display: inline-block;。我为您修复了小提琴：http://jsfiddle.net/3L5d7awj/

在标签内垂直对齐文本的问题

2 个答案: