Для создания разных маркеров (bullets) у двух слайдеров в HTML можно использовать псевдоэлементы ::before или ::after с помощью CSS. Маркеры можете стилизовать по своему усмотрению.
Вот пример кода HTML:
<div class="slider1"> <ul> <li>Слайд 1</li> <li>Слайд 2</li> <li>Слайд 3</li> </ul> </div> <div class="slider2"> <ul> <li>Слайд 1</li> <li>Слайд 2</li> <li>Слайд 3</li> </ul> </div>
В CSS вы можете добавить стили для каждого слайдера:
.slider1 ul { list-style: none; counter-reset: slider1-counter; /* счетчик для первого слайдера */ } .slider1 li::before { counter-increment: slider1-counter; content: counter(slider1-counter) "."; /* создаем маркер со значением счетчика и точкой */ margin-right: 5px; /* добавляем небольшой отступ для разделения маркера и текста слайда */ /* добавьте другие стили по вашему выбору */ } .slider2 ul { list-style: none; counter-reset: slider2-counter; /* счетчик для второго слайдера */ } .slider2 li::before { counter-increment: slider2-counter; content: counter(slider2-counter) "."; /* создаем маркер со значением счетчика и точкой */ margin-right: 5px; /* добавляем небольшой отступ для разделения маркера и текста слайда */ /* добавьте другие стили по вашему выбору */ }
В данном примере мы использовали счетчики для каждого слайдера и псевдоэлементы ::before для добавления маркера перед каждым элементом списка (li). Стилизация маркера (размер, цвет, фон и т.д.) можно изменить в соответствии с вашими потребностями.
Таким образом, вы сможете создать разные маркеры для каждого слайдера в HTML.