Css 如何在ul li标签内的标签之间获得更多的空间

我正在创建一个带有ul li标签的菜单栏，链接要紧密连接，如何使它们在链接之间有更大的空间？

在li元素上留出空白

<nav>
  <ul>
    <li><a href="#"><span>Home</span></a></li>
    <li><a href="#"><span>Gallery</span></a></li>
    <li class="last"><a href="#"><span>Map</span></a></li>
  </ul>
</nav>


<style>
li{
    display:inline-block; 
    background:blue; 
    width:100px; 
    height:20px; 
    text-align:center;
    margin-right:15px; /* edit this margin to separate your elements*/
}
a{
    text-decoration:none; 
    color:black;
    display:block;
}
.last {margin-right:0px;}
</style>

李{
显示：内联块；
背景：蓝色；
宽度：100px；
高度：20px；
文本对齐：居中；
右边距：15px；/*编辑此边距以分隔元素*/
}
a{
文字装饰：无；
颜色：黑色；
显示：块；
}
.last{右边距：0px；}

---

您可以从最后一个元素（如top）中删除边距，也可以使用jQuery或css li:last child，li:nth child（3）。。。但最好的方法是使用jQuery或类，因为它是sup。在所有浏览器中

填充？举个例子会很有用。