Html 在导航栏徽标和第一个导航链接之间添加空间

对不起，我的英语不好。我试图在logo之后增加一点空间，这样logo就留在左角，第一个导航链接就推到左侧，不是完全向左，而是向右。 我复制了完全相同的HTML和CSS代码

<nav class="nav navbar-default navbar">
    <div class="container">
    <div class="nav-header ">
        <a class="navbar-brand"><img src="C:\Users\usama\Downloads\logo.jpg" alt=""></a>
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav">
                <li class="navbarp"><a href="#"><i class="active fa fa-book fa-xs"></i><br><p></p>About</a></li>
                <li class="navbarp"><a href="#"><i class="fal fa-registered"></i><br><p></p>Admissions</a></li>
            </ul>
            <ul class="nav navbar-nav navbar-right">
                <li class="navbarp"><a href="#"><i class="fas fa-user-plus"></i><br><p></p>sign up</a></li>
                <li class="navbarp"><a href="#"><i class="fas fa-sign-in-alt"></i><br><p></p>login</a></li>
            </ul>
        </div>
    </div>
</div>

试试这个（填充添加到徽标的右侧）：

注意标题“about”是如何在标签之外的

我怀疑您希望它的格式如下：

<li class="navbarp"><a href="#"><i class="active fa fa-book fa-xs"></i><p>About</p></a></li>

由于单词正确地位于

标记中，您可能不需要

<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1" style="padding-left:15px">

<li class="navbarp"><a href="#"><i class="active fa fa-book fa-xs"></i><br><p></p>About</a></li>

<li class="navbarp"><a href="#"><i class="active fa fa-book fa-xs"></i><p>About</p></a></li>