如何在中心对齐向下箭头？

Question

我在 web page中放置了一个向下箭头，但它没有正确居中对齐。

这是箭头的CSS：

.arrow-test{

    position: absolute;
    bottom: 40px;


    border: 80px dashed transparent;
    border-top-color: #fff;
    border-bottom-style: solid;

}   

这是箭头的一个实例：

<div class="section " id="section0">
    <h1>音乐学习的路是孤独的<br /></h1>  
    <span class="arrow-test"></span>
</div>

和screenshot

Answer 1

请将底边距命令的边距减少到0，并将箭头的颜色从白色更改为黑色，以提高其可视性。