HTML + CSS: нумерованный список с числами внутри кружков.Html

Программисты Html
Ответить
Anonymous
 HTML + CSS: нумерованный список с числами внутри кружков.

Сообщение Anonymous »

Я пытаюсь создать упорядоченный список в CSS + HTML, который выглядит следующим образом:
Изображение


Я не могу понять, как это сделать. Я пробовал использовать list-image, но цифры не появляются. Я попытался установить фон, но он не будет отображаться за номером, если для параметра list-style-position установлено значение «вне». Я попробовал установить его с фоном и позицией в стиле списка: внутри, затем поместить текст внутри li в div, чтобы выровнять его, но никакая комбинация плавающих точек, полей и т. д. не работала без обертывания цифры.

Это похоже на то, что я видел на многих веб-сайтах, но на данный момент я не могу найти рабочий пример, и поиск в Google не дает мне никаких результатов. результаты.

Итак, может ли кто-нибудь мне с этим помочь? Как бы вы создали все вышеперечисленное, используя HTML+CSS, в идеале без использования JS и определенно без использования только изображений? Этот текст должен быть доступным для выбора и копирования/вставки.

Поскольку один из комментаторов спросил, вот разметка, которая у меня сейчас есть:
  • List item one.
  • List item two.
  • List item three.

Ни один из CSS, которые я пробовал, даже близко не работал, поэтому я не уверен, стоит ли делиться тем, что у меня есть на данный момент. Вот одна из версий, которая не удалась...

ol { display: block; list-style: decimal outside url('/images/lists/yellow-circle-18px.png'); }
ol li { width: 176px; margin-right: 20px; float: left; }
ol li span { display: block; }


Подробнее здесь: https://stackoverflow.com/questions/573 ... of-circles
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Html»