как использовать навигационную панель nav-tag с разделителями, которые не являются частью ссылки

Question

Меня интересует использование тега nav вместо div> ul> li> a для горизонтального навигационного меню.

Я могу получить навигационную панель и вставить разделители.

С помощью div> ul> li> a подход к добавленным разделителям не является частью ссылки, так как они добавлены в ли.

Когда я использую nav> a и вставляем разделители, они включены как часть ссылки.

Я пробовал: nav a: before: link {text-decoration: none;} в css, но это не сработало.

Также добавление text-decoration: none в css, который добавляет мои разделители, не работает.

nav a: before {content: "|"; текст-отделка: нет;}

с помощью СЧА> li> дает мне вертикальный список с пулями по умолчанию, который побеждает цель использования навигационной метки.

вот пример вывода, где вы можете увидеть "|" разделители включены как часть ссылки.

Реализованный мои перечисленные выше усилия (которые не работают) только бы удалили подчеркивание (не ссылку), даже если они работали. Я хотел бы удалить ссылку из разделителей, но могу согласиться на удаление подчеркивания, если это все, что я могу получить.

Answer 1

оба эти работали: HTML (просто поставить разделитель непосредственно в навигационной панели)

<nav> 
    |<a href="s">dsa</a>| 
    <a href="a">sdf</a>| 
    <a href="d">rsd</a>| 
</nav> 

или поставить разделитель в р-таг, что а-тег вложен в:

CSS :

nav p{display: inline; margin-right:15px;} 
nav a{margin: 10px} 

с HTML:

<nav> 
    <p><a href="t">fdd</a></p> 
    <p>|<a href="e">fdd</a></p> 
    <p>|<a href="d">fss</a></p> 
    <p>|<a href="d">gde</a></p> 
</nav>