Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.92/13: Рейтинг темы: голосов - 13, средняя оценка - 4.92
0 / 0 / 0
Регистрация: 25.04.2017
Сообщений: 11

Вертикальные линии в списке с использованием :before

22.11.2017, 04:36. Показов 2704. Ответов 1
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Здравствуйте, подскажите пожалуйста, как после использования :before для постановки символа "|" в тексте находящемся в тегах <a> завёрнутых в <li> первого уровня вложенности убрать символ "|" для первого элемента списка (HOME). Пробовал использовать :first-child, не сработало. Пример привёл ниже.

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<nav>
<ul class="menu">
    <li><a href="#">HOME</a>
         <ul class="sub-menu">
            <li><a href="#">Sub-Menu 1</a></li>
            <li><a href="#">Sub-Menu 2</a></li>
            <li><a href="#">Sub-Menu 3</a></li>
        </ul>
    </li>
    <li><a  href="#">ABOUT</a></li>
    <li><a  href="#">PORTFOLIO</a>
        <ul class="sub-menu">
            <li><a href="#">Sub-Menu 1</a></li>
            <li><a href="#">Level 3 Menu</a>
                <ul>
                    <li><a href="#">Sub-Menu 4</a></li>
                    <li><a href="#">Sub-Menu 5</a></li>
                    <li><a href="#">Sub-Menu 6</a></li>
                </ul>
            </li>
        </ul>
   </li>
   <li><a  href="#">BLOG</a></li>
   <li><a  href="#">CONTACT</a></li>
</ul>
</nav>
CSS
1
2
3
4
5
6
7
8
9
.menu  > li >  a::before{
    content: "|";
    font-size: 13px;
    padding-right: 5px;
}
 
 .menu > li > a :first-child{
   content:none;
}
0
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
22.11.2017, 04:36
Ответы с готовыми решениями:

Вертикальные разграничивающие линии в Ribbon
Здравствуйте! Как установить вертикальные разграничивающие линии в Ribbon. Раньше ставил, сейчас не помню как это сделать. (Линии как в...

Среда разработки. Вертикальные цветные линии от { до }
Добрый день. Посмотрите на скриншот, там видно что Begin и End (Delphi 7) имеют красивую подсветку которая позваляет лучше ...

Нарисовать вертикальные линии разных цветов
Вывести в ряд 10 вертикальных линий разных цветов, используя оператор gotoxy. Помогите пожалуйста.А то у меня это задание вообще не...

1
Модератор
Эксперт HTML/CSS
 Аватар для AlexZaw
2379 / 1739 / 677
Регистрация: 07.08.2016
Сообщений: 4,094
22.11.2017, 10:41
CSS
1
2
3
 .menu > li:first-child > a:before{
   content:none;
}
1
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
22.11.2017, 10:41
Помогаю со студенческими работами здесь

Как найти вертикальные линии на изображении?
Как найти вертикальные линии на изображении и их координаты (например, координаты начальной и конечной точек линий)? Гуглил и курил...

Вертикальные Иконки в списке
Доброго времени суток. В данный момент работаю в DreamWiever cc 17 и столкнулся с трудностями расположения иконок параллельно списку. Прошу...

В элементах WPF формы не показывается вертикальные линии
При создании формы с помощью технологии WPF не показывает вертикальные линии. В чём проблема? &lt;Window...

Вертикальные линии на темных цветах. ASUS Rog 951JT
Здравствуйте, Может кто-нибудь сталкивался с такой пробелмой. После включения компютера начал замечать вертикальные темно-серые линии...

. У меня при включении компьютера вертикальные красные линии
Подскажите пожалуйста , что делать ? У меня при включении компьютера вертикальные красные линии , при обычной загрузке экран становиться...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
2
Ответ Создать тему
Новые блоги и статьи
SDL3 для Web (WebAssembly): Реализация движения на Box2D v3 - трение и коллизии с повёрнутыми стенами
8Observer8 20.02.2026
Содержание блога Box2D позволяет легко создать главного героя, который не проходит сквозь стены и перемещается с заданным трением о препятствия, которые можно располагать под углом, как верхнее. . .
Конвертировать закладки radiotray-ng в m3u-плейлист
damix 19.02.2026
Это можно сделать скриптом для PowerShell. Использование . \СonvertRadiotrayToM3U. ps1 <path_to_bookmarks. json> Рядом с файлом bookmarks. json появится файл bookmarks. m3u с результатом. # Check if. . .
Семь CDC на одном интерфейсе: 5 U[S]ARTов, 1 CAN и 1 SSI
Eddy_Em 18.02.2026
Постепенно допиливаю свою "многоинтерфейсную плату". Выглядит вот так: https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11617&stc=1&d=1771445347 Основана на STM32F303RBT6. На борту пять. . .
Камера Toupcam IUA500KMA
Eddy_Em 12.02.2026
Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .
И ясному Солнцу
zbw 12.02.2026
И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.
«Знание-Сила»
zbw 12.02.2026
«Знание-Сила» «Время-Деньги» «Деньги -Пуля»
SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров
8Observer8 12.02.2026
Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image)
8Observer8 11.02.2026
Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru