Мобильная версияЯ работаю над CSS, в котором создаю индикатор выполнения.
Мой код выглядит следующим образом:
.breadcrumbstyle ul { стиль списка: нет; заполнение: 0; маржа: 0; } .breadcrumbstyle уль ли { отображение: встроенный блок; маржа: 0; заполнение: 0; } .breadcrumbstyle уль ли а { ширина: 120 пикселей; высота: 32 пикселей; дисплей: блок; плыть налево; фон: #ACACAC; выравнивание текста: по центру; отступ-верх: 2px; положение: относительное; поле: 0 3px 0 0; /* Скорректировано поле для уменьшения пространства */ текстовое оформление: нет; цвет: #fff; } .breadcrumbstyle ul li a:before { содержание: ""; border-top: 10 пикселей сплошной прозрачный; border-bottom: 10 пикселей сплошной прозрачный; левая граница: 10 пикселей, сплошная #fff; позиция: абсолютная; слева: 0; верх: 0; z-индекс: 0; } .breadcrumbstyle ul li a:after { содержание: ""; border-top: 10 пикселей сплошной прозрачный; border-bottom: 10 пикселей сплошной прозрачный; левая граница: 10 пикселей, сплошная #ACACAC; позиция: абсолютная; справа: -5 пикселей; верх: 0; } .breadcrumbstyle ul li:first-child a { граница-верхний левый радиус: 10 пикселей; граница-нижний-левый радиус: 10 пикселей; } .breadcrumbstyle ul li:first-child a:before { дисплей: нет; } .breadcrumbstyle ul li:last-child a { граница-верхний-правый-радиус: 10 пикселей; граница-нижний-правый-радиус: 10 пикселей; } .breadcrumbstyle ul li:last-child a:after { дисплей: нет; Квалифицирован Новое Работаем Воспитание Преобразовано
При этом я получаю индикатор выполнения, подобный этому Progress_bar.
Но в этом коде форма стрелок неправильная. Мне нужна форма стрелки: required_bar. Как я могу изменить форму своих полосок точно так же, как требуется, как показано на изображении.
