Html 如何在导航栏中平均隔开链接？

嗨，我是html和css的新手，我无法在导航栏中隔开链接

这就是我想要得到的：

这就是我到目前为止所做的：

.topnav{
溢出：隐藏；
背景色：白色；
边框：5px纯黑；
}
.topnav a{
浮动：左；
显示：块；
颜色：黑色；
文本对齐：居中；
填充：14px 30px；
文字装饰：无；
字号：17px；
边框底部：3倍纯色透明；
}

关于我

.topnav{
溢出：隐藏；
背景色：白色；
边框：5px纯黑；
}
.topnav a{
浮动：左；
显示：块；
颜色：黑色；
文本对齐：居中；
填充：14px 30px；
文字装饰：无；
字号：17px；
边框底部：3倍纯色透明；
}
保险商实验室{
显示器：flex；
证明内容：之间的空间；
对齐项目：居中；
填充：0；
}

关于我

我已将您的导航元素重命名为“topnav”类。使用display flex代替display block，因为它将帮助您重新调整项目，使其相对于导航栏做出响应。您可以使用均匀对齐内容：空格来确保每个文本项之间的距离相等

我在下面附上了一段代码示例片段供您测试

.topnav{
溢出：隐藏；
背景色：白色；
边框：5px纯黑；
}
托普纳夫{
显示器：flex；
对正内容：空间均匀；
颜色：黑色；
文本对齐：居中；
文字装饰：无；
字号：17px；
边框底部：3倍纯色透明；
}
.topnav ul a{
文字装饰：无；
}

关于我

需要添加

填充：0至
ul
。（除非是浏览器在这里做的。）不，不是浏览器做的，因为flex属性。谢谢你提到这件事。更新了吗
.topnav ul {
  display: flex;
  justify-content: space-around;
}

.topnav a {
    display: inline-block;
    color: black;
    background-color: rgb(233, 233, 233);
    text-align: center;
    padding: 5px;
    text-decoration: none;
    font-size: 17px;
    flex: 1;
    border: 3px solid black;
}

ul{
    display: flex;
    justify-content: center;
    border-left: 2px solid black;
    border-right: 2px solid black;
    border-top: 5px solid black;
    border-bottom: 5px solid black;
    padding: 0;
    background-color: black;
}