Как убрать точки в списке html
Перейти к содержимому

Как убрать точки в списке html

  • автор:

Как убрать маркеры в списке?

Чтобы скрыть отображение маркеров в списке применяется стилевое свойство list-style-type со значением none . Его следует добавить к селектору ul или li , как показано в примере 1.

Пример 1. Список без маркеров

Результат данного примера показан на рис. 1.

Список без маркеров

Рис. 1. Список без маркеров

Маркеры хотя и не отображаются в списке, но текст при этом всё равно оказывается сдвинут вправо. Чтобы управлять положением элементов списка, для селектора ul в данном примере добавлено свойство padding-left с нулевым значением.

См. также

  • list-style-type
  • padding-left

Как в HTML создать маркированный список без маркеров (убрать точки у li)

В некоторых случаях может понадобиться создать маркированный список без маркеров. Ниже описано несколько способов реализации этого с помощью HTML . В том числе и с помощь list style none .

Пример HTML

    ) или упорядоченного списка (
    ) уберет любые маркеры или номера:

Пример HTML с CSS

Приведенный выше пример работает почти в любой ситуации. Но лучше размещать CSS во внешнем файле стилей. Ниже приведены CSS и HTML , которые можно использовать для удаления маркеров.

    ). Это может понадобиться, если вы не намерены ставить маркеры или хотите использовать вместо них изображения:

Но лучше создать класс list style none CSS , который можно будет использовать в том случае, когда не нужно показывать маркеры. Код CSS :

 .nobull

В приведенном выше коде CSS создается новый класс «nobull» . Его можно задействовать в тех случаях, когда не нужно показывать маркер. Например:

Вывод примера

Ниже показано, как выводится на экран неупорядоченный список без маркеров с помощью list style type none .

КК Константин Кондрусин автор статьи « How to create a bullet list with no bullets in HTML »

Как убрать маркеры в маркированном списке?

Для этой цели применяется стилевое свойство list-style-type со значением none . Его следует добавить к селектору UL или LI как показано в примере 1.

Пример 1. Список без маркеров

HTML5 CSS 2.1 IE Cr Op Sa Fx

Результат данного примера показан на рис. 1.

Список без маркеров

Рис. 1. Список без маркеров

Маркеры хотя и не отображаются в списке, но текст при этом всё равно оказывается сдвинут вправо. Чтобы управлять положением элементов списка, для селектора UL в данном примере добавлены свойства margin-left и padding-left . Два свойства вместо одного требуется, чтобы одинаково показывать результат в разных браузерах.

CSS по теме

Не выкладывайте свой код напрямую в комментариях, он отображается некорректно. Воспользуйтесь сервисом cssdeck.com или jsfiddle.net, сохраните код и в комментариях дайте на него ссылку. Так и результат сразу увидят.

Популярные рецепты

  • Как добавить картинку на веб-страницу?
  • Как добавить иконку сайта в адресную строку браузера?
  • Как добавить фоновый рисунок на веб-страницу?
  • Как сделать обтекание картинки текстом?
  • Как растянуть фон на всю ширину окна?
  • Как выровнять фотографию по центру веб-страницы?
  • Как разместить элементы списка горизонтально?
  • Как убрать подчеркивание у ссылок?
  • Как убрать маркеры в маркированном списке?
  • Как изменить расстояние между строками текста?
  • Как сделать, чтобы картинка менялась при наведении на нее курсора мыши?
  • Как открыть ссылку в новом окне?

Как убрать точки в списке html

    или
    существует CSS свойство list-style-type . Оно может принимать разные значения, например circle, square или decimal. Для того чтобы убрать маркер — нужно выставить значение none.

Рассмотрим пример ниже:

  Есть маркер Есть маркер Есть маркер   Маркер убран Маркер убран Маркер убран  
ol  list-style-type: none; > ul  list-style-type: "✔"; > 

ul-styled

Результат:

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *