将标签固定在垂直位置

Question

有人能帮我如何垂直显示锚点标签吗？

我在分区中有锚标签

<div class="anchorClass">
<a href="xxxxxxxxx">Test 1</a>
<a href="xxxxxxxxx">Test 2</a>
<a href="xxxxxxxxx">Test 3</a>
<a href="xxxxxxxxx">Test 4</a>
<a href="xxxxxxxxx">Test 5</a>
<a href="xxxxxxxxx">Test 6</a>
<a href="xxxxxxxxx">Test 7</a>
</div>

它显示如下：

Test 1 Test 2 Test 3 Test 4 Test 5 Test 6 Test 7

我需要使用css垂直对齐

Test 1 
Test 2 
Test 3 
Test 4 
Test 5 
Test 6 
Test 7

Answer 1

您可以使用

.anchorClass {
display: flex;
flex-direction: column;
}

Answer 2

您可以使用Mubasher Ali的解决方案。或者，您可以将anchorClass类中的所有锚都设置为块级元素：

.anchorClass a {
display: block;
}

Answer 3

此处不需要Flexbox。最简单的方法是用display: block将容器内的锚点声明为块级元素

.anchorClass a {
display: block;
}

<div class="anchorClass">
<a href="xxxxxxxxx">Test 1</a>
<a href="xxxxxxxxx">Test 2</a>
<a href="xxxxxxxxx">Test 3</a>
<a href="xxxxxxxxx">Test 4</a>
<a href="xxxxxxxxx">Test 5</a>
<a href="xxxxxxxxx">Test 6</a>
<a href="xxxxxxxxx">Test 7</a>
</div>