Избавляемся от пунктов маркера от <ul>

163

У меня есть следующий список:

 <ul id="otis">
 <li>Benz</li>
 <li>Other Benz</li>
 <li>Other Other Benz</li>
 </ul>

Я хочу избавиться от пуль, поэтому я попытался:

 ul#otis {
 list-style-type: none;
 }

Это не сработало. Как правильно удалить маркеры из отображаемого списка?

html html-lists Сэм Хан
источник

1

Ваш текущий HTML / CSS отлично работает для меня в FF (JSFiddle). Какой браузер вы используете? Посмотрите, list-style: noneработает ли вместо этого.

Bojangles

1

Я попробовал это на всех браузерах и Mac и Windows OS. я использую html5 doctype ...

Сэм Хан

197

Предполагая, что это не сработало, вы можете захотеть объединить idселектор на основе с и li, чтобы применить css к liэлементам:

#otis li {
    list-style-type: none;
}

Ссылка:

list-style-typeв Центре разработчиков Mozilla .

Дэвид говорит восстановить Монику
источник

В чем разница ul#otisи делать #otis?

PeeHaa

На самом деле нет ни одного, я просто не смог увидеть idвыбранный вами селектор. Ой, извини!

Дэвид говорит восстановить Монику

1

где по этой ссылке я могу найти, что она должна быть определена на li?

PeeHaa

Первые два предложения: «В list-style-typeCSS свойство определяет появление элемента элемента списка , так как это только один , который по умолчанию. display:list-item» (Хотя это не допустить , что он может обратиться к любому элементу с displayимуществом). Хотя они определяют это, например, под olэлементом. Лично я всегда по умолчанию определяю его как для списка ( ul/ ol), так и для liэлементов.

Дэвид говорит восстановить Монику

27

У меня была такая же крайняя раздражающая проблема, поскольку сценарий не обращал внимания на мою таблицу стилей. Итак, я написал:

<ul style="list-style-type: none;">

Это не сработало. Итак, кроме того , я написал:

<li style="list-style-type: none;">

Вуаля! это сработало!

Джон Олав
источник

20

Чтобы удалить маркеры из неупорядоченных списков, вы можете использовать:

list-style: none;

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

list-style-type: none;

Либо работает, но первый - более короткий способ получить тот же результат.

Филпот
источник

19

Следующий код

#menu li{
  list-style-type: none;
}

<ul id="menu">
    <li>Root node 1</li>
    <li>Root node 2</li>
</ul>

Развернуть фрагмент

будет производить этот вывод:

вывод

Kishan
источник

15

Попробуйте это вместо этого, протестировано на Chrome / Safari

ul {
 list-style: none;
}

Пол Каплан
источник

4

Ставить

<style type="text/css">
 ul#otis {
     list-style-type: none;
   }
</style>

непосредственно перед списком, чтобы проверить это. Или

<ul style="list-style-type: none;">

дрянь
источник

4

Чтобы удалить пулю, ULвы можете просто использовать list-style: none;или, list-style-type: none;если все еще не работает, то я думаю, что есть проблема приоритета CSS . Может быть, глобально UL уже определен. Так что лучший способ добавить класс / ID к этому конкретному UL и добавить туда свой CSS . Надеюсь, это сработает.

Рокан Нашп
источник

4

Это отлично работало HTML

<ul id="top-list">
        <li><a href="#">Home</a></li>
        <li><a href="#">Process</a></li>
        <li><a href="#">Work</a></li>
        <li><a href="#">Team</a></li>
        <li><a href="#">Contact</a></li>
      </ul>

CSS

#top-list{
  list-style-type: none;
  list-style: none;}

pokumars
источник

3

Там должно быть что-то еще.

Так как:

   ul#otis {
     list-style-type: none;
   }

должен просто работать.

Возможно, есть какое-то правило CSS, которое переписывает его.

Используйте свой инспектор DOM, чтобы узнать.

PeeHaa
источник

3

У меня была та же самая проблема, и способ, которым я закончил исправлять это, был таким:

ul, li{
    list-style:none;
    list-style-type:none;
}

Может быть, это немного экстрим, но когда я это сделал, это сработало для меня.

Надеюсь, это помогло

Брэден Бест
источник

3

для встроенной таблицы стилей попробуйте этот код

<ul style="list-style-type: none;">
    <li>Try This</li>
    </ul>

Люк
источник

1

ваш код:

ul#otis {
    list-style-type: none;
}

мое предложение:

#otis {
    list-style-type: none;

}

в css нужно только использовать #idnot element#id. более полезные советы приведены здесь: w3schools

Evan
источник

0

У меня была идентичная проблема.

Решение состояло в том, что пуля была добавлена через фоновое изображение , а НЕ через list-style-type. Быстрый «фон: нет» и Боб твой дядя!

Раскин
источник

Избавляемся от пунктов маркера от <ul>

Ответы: