Путаница со списком <li>

Question

У меня проблема с li, когда я беру li на inline дисплее с list-style (точка маркера), тогда точки маркера не отображаются.

Answer 1

bullet-point является , а не допустимым значением для list-style. Вместо этого используйте один из этих :

• нет Нет маркера
• круг маркер круга
• диск Маркер представляет собой заполненный круг. Это по умолчанию
• квадрат маркер квадрат
• Армянский Маркер традиционной армянской нумерации
• десятичное число Маркер представляет собой число
• десятичное ведение-ноль Маркер - это число, дополненное начальными нулями (01, 02, 03 и т. Д.)
• грузинский маркер - традиционная грузинская нумерация (an, ban, gan и др.)
• низшая альфа Маркер низшая альфа (a, b, c, d, e и т. Д.)
• нижнегреческий маркер нижнегреческий (альфа, бета, гамма и т. Д.)
• нижний латинский маркер нижний латинский (a, b, c, d, e и т. Д.)
• нижнеримский маркер нижнеримский (i, ii, iii, iv, v и т. Д.)
• верхняя альфа Маркер верхняя альфа (A, B, C, D, E и т. Д.)
• верхний латинский маркер верхний латинский (A, B, C, D, E и т. Д.)
• верхнеримский маркер верхнеримский (I, II, III, IV, V и т. Д.)
• наследовать Указывает, что значение свойства list-style-type должно быть унаследовано от родительского элемента

Нажмите , чтобы узнать больше об этом, включая поддержку браузера

Answer 2

Список маркеров отображается, потому что <li> элементы имеют display: list-item по умолчанию. Если вы измените его на что-либо другое (например, display: inline или даже display: block), пули исчезнут.

Если вы хотите создать горизонтальное меню, у вас есть две возможности:

1. Оставьте атрибут по умолчанию display и играйте с float вместо
2. Имитация пуль с фоновыми изображениями

Answer 3

Если вам нужна совместимость с кроссбраузером

Вот 2 метода

1. Используйте изображения li {background-image:url(bullet.gif) no-repeat center left;padding-left:20px;display:inline;}

2. или используйте • как это <li>&bull; Lorem ipsum dolor sit amet</li>

Answer 4

Другой вариант, к сожалению, не кросс-браузерный:

li
{
    display: inline;
}
li:before
{
    content: '•';
    padding: 0 .5em;
}

Answer 5

У вас есть поля / отступы для ul или li? У вас есть сброс браузера в вашей таблице стилей, установив list-style-type на none? Я предполагаю, что это одна из тех двух вещей.

Answer 6

Я думаю, вам нужно использовать float, если вы хотите показать элементы списка, а не как блок, а также увидеть маркеры