Нумерованный список это список каждый пункт которого отмечается
Перейти к содержимому

Нумерованный список это список каждый пункт которого отмечается

  • автор:

Как правильно оформлять списки? (подробная инструкция для копирайтера)

При написании текста мало знать, как правильно пишется то или иное слово. Важно правильно оформлять слова в предложения, а предложения — правильно структурировать, иногда употребляя списки. Разные перечисления оформляются по-разному.

О том, как правильно оформить список, читайте дальше.

Виды списков

Перечни бывают нумерованные и маркированные . Какая разница между нумерованным и маркированным списками? Нумерованный всегда употребляется в многоуровневой структуре. Также, если в обобщающем предложении есть указание на число пунктов, то следует употребить цифровые маркеры. В остальных случаях можно употреблять маркированные перечисления.

Нумерованный список

В нумерованных списках используются римские или арабские цифры, а также заглавные и строчные буквы. Если пункты начинаются с прописной буквы, то уместны:

  • римские и арабские цифры с точкой — их целесообразно использовать в многоуровневых списках;
  • прописные литеры с точкой — А. Б. В. — равнозначны цифрам.

Многоуровневые списки — это те, в которых есть перечисление состава или характеристик чего-либо, при этом у каждого есть свои подпункты. Существует следующее членение перечней:

  • главные пункты обозначаются римскими цифрами или заглавными буквами с точкой;
  • следующие по значимости — цифры с точкой;
  • последние подразделы маркируются арабскими цифрами или строчными буквами со скобкой, а также маркерами.

Маркированный список

Пример 1
  • Блок. Деталь корпуса, к которой прикрепляются механизмы и разные детали мотора.
  • Цилиндр. Отверстие в блоке для обеспечения направляющего поршня. В головке цилиндра находятся клапаны, распредвалы и механизмы привода клапанов.
  • Поршень. Деталь в форме цилиндра используется для преобразования энергии горения автомобильного топлива в механическую энергию.
  • Коленчатый вал. Главная деталь кривошипно-шатунного механизма находится в нижней части мотора.
Пример 2
  • предлог — указывает на местонахождение предмета или объекта и выражает зависимость слов друг от друга. Существует большое число предлогов, которые делятся на производные — от других частей речи — и непроизводные;
  • союз — указывает на объединение, разделение и противопоставление слов в предложении. Делятся на две большие группы сочинительных и подчинительных союзов;
  • частица — с ее помощью можно усилить значение рядом стоящего слова, а также образовать новые;
  • междометие — выражает чувства, интонацию на письме.

Кстати , в тексте красиво выглядит длинное тире (Alt + 0151). Если пункт объемный, в котором и характеристики раскрываются, и свойства, и другие разъяснения, лучше использовать точку. В пунктах, состоящих из 3–5 слов вообще знаки не нужны.
В маркированном списке расположить пункты относительно друг друга можно несколькими способами:

  • согласно иерархии — от главного по сути к менее значимым;
  • при равноценности информации в пунктах — по алфавиту;
  • по росту или убыванию чисел в начале пункта.

Что в начале?

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

Существует несколько случаев, когда ставится двоеточие .

1. При наличии в предложении специального слова, после которого 100-процентно последует список.

Если человек получил тепловой удар, нужно:
1) отнести его в тень,
2) снять одежду, освободив область груди,
3) положить на голову холодное мокрое полотенце.

2. Перечисление после двоеточия является объяснением того, что было до него.

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

Во всех остальных случаях надо ставить точку.

Что в конце?

  • точка в конце пункта ставится, если перед ним также была точка;
  • запятой отделяют перечисление однородных членов предложения, и другие знаки препинания в списке отсутствуют;
  • точка с запятой ставится, если пункт начинался со строчной буквы, а внутри есть другие знаки препинания.

Как органично вписать списки?

Теперь поговорим о том, как красиво включить списки в текст. Очевидно, что список относится к какому-то разделу.

Начало. Между названием раздела и списком должно быть хотя бы одно предложение. Если нечего написать, то можно анонсировать то, из чего состоит список.

Например, пишете про преимущества напольного кондиционера. Логично назвать раздел «Преимущества мобильного кондиционера» и первое предложение оформить так:
«Из плюсов портативного кондиционера можно выделить отсутствие необходимости установки, возможность перевозить его в разные локации в течение дня и эстетичность».
Далее раскрываете список.

Конец. После последнего пункта также должно быть хотя бы одно предложение. Можно последний пункт списка как раз оформить в виде заключения раздела.

Заключение

  1. Для легкого восприятия текста нужно использовать списки: нумерованные или маркированные.
  2. Нумеровать следует многоуровневые перечни и солидные по объему пункты. Для небольших списков можно использовать специальные знаки.
  3. Обобщающая фраза может заканчиваться двоеточием или точкой.
  4. В конце пунктов ставятся запятая, точка с запятой либо точка.

Теперь вы знаете, как писать правильно текст со списками перечислений.

Подписывайтесь на мои соцсети, чтобы получать полезный контент, бесплатные уроки и скидки!

Списки (ul, ol, li) в HTML

Если у Вас появились вопросы по материалам на нашем сайте, то пожалуйста, пришлите нам их на почтовый адрес support@mousedc.ru. Мы обязательно ответим.

Также Вы можете отправить нам свой отзыв на наши услуги, замечание или предложение. Мы ценим наших клиентов и внимательно прислушиваемся ко всем замечаниям!

  • HTML
    • Основы
    • Теги
    • Основы
    • Свойства
    • Основы
    • База данных
    • Объектно-ориентированное программирование
    • Laravel
    • Yii
    • Основы
    • WordPress
      • Управление
      • Разработка
      • Управление
      • Разработка
      • Управление
      • Разработка
      • Управление
      • Разработка
      • Управление
      • Разработка
      • Управление
      • Разработка
      • Управление
      • Управление
      • Управление
      • Управление
      • Управление
      • Управление
      • Основы
      • Работа с DOM
      • AJAX
      • jQuery
      • Vue
      • NodeJS
      • React
        • Основы React
        • Стейты в React
        • Компоненты React
        • Apache
        • Игровые серверы
        • Linux
        • MySQL
        • Docker
        • Nginx
        • Устранение ошибок
        • Почта
        • SEO
        • Личный кабинет
        • Виртуальный хостинг
        • Домены

        DDoS атака на регистратора

        • Генератор паролей
        • Генератор .htpasswd

        Коврик для мыши новым клиентам

        Оплатите хостинг на год и получите удобный коврик

        Помощь в переносе
        с другого хостинга

        Хотите переехать? Мы поможем перенести всё

        Запишитесь на интенсивные курсы по созданию сайтов.

        Приветствуем всех в нашем уютном дата центре! Мы предоставляем качественный и надёжный хостинг. У нас можно заказать домены и VPS, прочитать статьи по созданию сайтов и информационной безопасности. А из наших видео подкастов можно узнать о том, как продвигать и развивать iT-проекты.

        Виды списков в Word – какие бывают и как использовать

        При создании документов в Ворде часто для систематизации текста используются списки. Существует несколько видов списков, а также вариантов их оформления и создания.

        Виды списков в Word

        В документе Word 2007, 2010, 2013 (и других версиях) список может быть нумерованным или маркированным. Кроме этого он может быть простым или многоуровневым.

        Нумерованные применяются в тех случаях, когда каждому пункту нужно присвоить порядковый номер. Нумеровать можно упорядоченный перечень этапов какого-либо процесса.

        Маркированный вариант подходит в том случае, когда все пункты связаны между собой, но не имеют определенной последовательности. Маркировать можно, например, перечень вещей, которые надо взять с собой в путешествие, порядковая нумерация не важна, и можно создать маркированный список.

        Многоуровневые перечни включают подпункты. Они позволяют упорядочить большой объем информации и представить ее в удобоваримом читабельном виде.

        Маркированный

        В маркированном списке перед каждым элементом общего порядка стоит тот или иной значок — маркер. Маркером может быть черный кружок (используется чаще всего), квадратик, галочка, определенная цифра или какое-либо другое графическое обозначение. Существует два варианта создания маркированного списка в Word. Первый вариант — преобразование уже набранного текста. Второй — оформление в процессе набора текста.

        Маркированный список

        Если список уже набран, его нужно выделить, зажав правую клавишу мыши. После этого на верхней панели во вкладке «Главная» найти кнопку «Маркеры» и кликнуть по ней. Используя этот способ важно учитывать, что каждый пункт должен быть набран с новой строки. Если перечень набран через запятую, нужно разделить его на элементы таким же образом, как текст делится на абзацы.

        Новый маркер

        Чтобы получить маркированный список непосредственно в процессе набора текста, надо перед набором первого пункта перевести курсор на новую строку, нажав клавишу Enter и нажать на кнопку «Маркеры». Далее просто перед каждым последующим элементом курсор переводится на новую строку.

        Нумерованный

        Нумерованные списки

        Создается он так же, как и маркированный. Разница лишь в том, что нажимать нужно кнопку нумерации, которая расположена рядом с маркировочной. Нумеровать пункты тоже можно в процессе набора текста или потом, когда пункты уже напечатаны.

        Многоуровневый

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

        Для оформления многоступенчатого перечисления в Ворде предусмотрено три несложных способа. Первый способ сделать многоуровневый список заключается в предварительной подготовке текста и последующем преобразовании его в список. В этом случае каждый новый пункт следует набрать с абзаца.

        Многоуровневый список

        Перед подпунктами первого уровня следует делать в начале строки отступ, нажав три раза пробел. Перед элементом второго уровня нужно сделать более широкий отступ, нажав на пробел 6 раз. Готовый текст выделить, нажать на кнопку «Многоуровневый» и выбрать понравившийся стиль оформления. У данного способа есть один недостаток – необходимость считать количество пробелов.

        Изменение уровня

        Второй способ организовать иерархический список проще в исполнении, но требует немного больше времени. При его использовании необходимо сначала набрать текст как для одноступенчатого перечня. После этого его преобразовывают в обычный перечень — маркированный или нумерованный. Далее выделяют части второго уровня, нажимают на стрелочку кнопки «Многоуровневый», и в самом низу выпадающего окна нажимают на строчку «Изменить уровень». Выпадает еще одно меню, и в нем можно выбрать уровень для выделенных элементов.

        Изменение отсутпа

        Перевести тот или иной пункт на другой уровень можно еще одним способом. В строчке перед ним надо поставить курсор и нажать кнопку «Увеличить отступ» или «Уменьшить отступ».

        Самый простой способ – использование клавиши Tab. Сначала набирается текст. Каждый элемент в новом абзаце. Затем выделяем все и формируем одноуровневый список. После этого часть, которую нужно перенести в подпункты выделяется. Одно нажатие Tab превращает элементы первого уровня в перечень второго, т.е. соответствует нажатию увеличения отступа. Два нажатия – и элементы приобретают вид третьего уровня, и т.д. Уменьшить отступ можно нажимая Shift+Tab. Этот способ очень удобный и занимает минимум времени, но при его использовании маркировка уровней чередуется автоматически и произвольно.

        Новый стиль многоуровневого списка

        Многоуровневый перечень может сочетать в себе разные варианты нумерации и различные маркеры. При необходимости оформить список каким-либо определенным образом можно сделать для него новый стиль. С этой целью следует создать список, выделить его и в меню «Многоуровневый» нажать на строку «Определить новый многоуровневый список». В появившемся окне можно для каждого уровня подобрать маркер, стиль нумерации, шрифт, отступ и другие параметры.

        Изменение вида маркеров

        Если при создании списка предложенный по умолчанию вид маркера не подходит, можно выбрать другой вариант, нажав на стрелку кнопки списка в верхней панели меню. При необходимости поставить оригинальный редкий маркер, которого нет во встроенной библиотеке, можно установить свой символ и использовать для маркировки его. Для таких целей существует меню «Определить свой маркер». В этом меню можно выбрать элемент из уже загруженных рисунков или графических символов, а можно загрузить свой рисунок.

        Изменение нумерации

        Если в готовом нумерованном списке нужно изменить порядковый номер пунктов, используют следующий способ. Сначала следует дважды кликнуть по номеру любого пункта. При этом нумерация будет выделена. Дальше наводится курсор на номер, который необходимо изменить и нажимается правая клавиша мыши. В открывшемся меню выбирают строку «Задать начальное значение» и устанавливается нужный номер.

        Начать список сначала

        Если нужно начать нумерацию с первого номера, следует дважды кликнуть на нумерацию, потом выбрать пункт, с которого начнется новый отсчет, кликнуть правой клавишей и в появившемся меню выбрать строку «Начать заново с 1».

        Продолжить нумерованный список

        В тех случаях, когда нужно дополнить список, а он уже встроен в текст, простым нажатием клавиши Enter новая строка может не превратиться в новый элемент. При подобных ситуациях надо напечатать недостающую часть перечня и преобразовать его в нумерованную.

        Задание начального значения

        Новый кусок будет иметь вначале пункт номер 1. Чтобы получить продолжение нумерации, следует выделить весь допечатанный кусок, нажать на стрелочку «Нумерованного списка», и внизу появившегося меню нажать на строку «Задать начальное значение». Далее просто указать с какого знака (цифры или буквы) должна начинаться эта часть перечня.

        Установка определенного значения номера списка

        В некоторых текстах приходится вставлять списки, которые начинаются не с первого, а какого-либо другого номера. Это можно сделать при помощи функции ручной нумерации. Сначала нужно, как и при варианте с продолжением перечня зайти в подпункт «Задать начальное значение». Далее активировать поле «Начать новый» и исправить цифру параметра «Начальное значение».

        Списки на веб-страницах

        Ещё в первой версии языка HTML был предусмотрен целый набор специальных тегов для представления информации в виде списков. И это не случайно, ведь списки являются одной из наиболее часто употребляемых форм представления данных в электронных и печатных документах. Вот лишь несколько случаев, для которых использование списков довольно удобно:

        • Расположение информации в стиле оглавления, пункты которого указывают на соответствующие разделы документа.
        • Объединение фрагментов информации в единую структуру для придания удобочитаемого вида.
        • Описание сложных пошаговых процессов.

        На сегодняшний день в HTML поддерживается три типа списков: маркированный, нумерованный и список определений. Рассмотрим особенности построения указанных списков, а также стилевые свойства, позволяющие изменять их внешний вид.

        Маркированный список

        Маркированный список — это список элементов, порядок следования которых не имеет значения. Иногда такие списки также называют неупорядоченными. Их можно использовать для отображения такой информации, как, например, перечень продукции, список доступных возможностей, тезисов и т.п.

        Для организации маркированного списка используется HTML-элемент <ul> (сокр. от англ. unordered list — «неупорядоченный список»). Оба тега элемента — открывающий и закрывающий — являются обязательными. В открывающем теге могут присутствовать универсальные атрибуты и атрибуты событий (см. спецификацию).

        Содержимым элемента <ul> могут быть элементы <li> (от нуля и более), с помощью которых собственно и создаются отдельные элементы списка. Всё содержимое элемента <ul> в браузере выводится с увеличенным отступом слева (см. рис. ниже).

        Пример разметки простого маркированного списка:

        В браузере это будет выглядеть так:

        Элементы маркированного списка

        Для выделения каждого элемента маркированного списка используется HTML-элемент <li> (сокр. от англ. list item – «элемент списка»). В открывающем теге элемента <li> могут присутствовать универсальные атрибуты и атрибуты событий. Закрывающий тег элемента является необязательным и может быть опущен, если за элементом непосредственно следует другой элемент <li> или закрывающий тег </ul> (см. спецификацию).

        Пример разметки маркированного списка без закрывающих тегов </li> :

        В браузере каждый новый элемент списка выводится с новой строки и предваряется маркёром. Если вид маркеров не задан разработчиком в файле стилей, большинство браузеров в качестве маркеров по умолчанию используют:

        • (круг) — для элементов основного списка;
        • (окружность) — для элементов вложенного списка второго уровня;
        • (квадрат) — для элементов вложенного списка третьего уровня.

        Цвет маркеров зависит от цвета текстового содержимого элементов.

        Нумерованный список

        Нумерованный список — это список элементов, порядок следования которых имеет значение. Иногда такие списки также называют упорядоченными. Типичным примером упорядоченного списка является запись последовательности действий или выполняемых операций.

        Для организации нумерованного списка используется HTML-элемент <ol> (сокр. от англ. ordered list — «упорядоченный список»). Оба тега элемента — открывающий и закрывающий — являются обязательными (см. спецификацию).

        Содержимым элемента <ol> могут быть элементы <li> (от нуля и более), с помощью которых собственно и создаются отдельные элементы списка. Всё содержимое элемента <ol> в браузере выводится с увеличенным отступом слева (см. рис. ниже).

        Пример разметки простого нумерованного списка:

        В открывающем теге элемента <ol> могут присутствовать универсальные атрибуты и атрибуты событий. Кроме того, в теге могут быть использованы собственные атрибуты: reversed , start и type .

        Необязательный булев атрибут reversed позволяет при необходимости задать в списке обратный порядок нумерации, например:

        Результат в браузере:

        Необязательный атрибут start позволяет указать число, с которого начнётся нумерация в списке. При записи значения атрибута следует использовать арабские цифры (1, 2, 3 и т.д.), даже когда установлена нумерация в буквах или римских цифрах. Например, чтобы начать нумерацию с буквы «d» или римской «IV», укажите start=»4″ .

        Потребность в атрибуте start обычно возникает, когда список на странице прерывается рисунком или каким-либо другим элементом, необходимым для иллюстрации или пояснения очередного пункта списка, например:

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

        • 1 — использовать арабские цифры (значение по умолчанию);
        • i — использовать римскую нумерацию строчными символами;
        • I — использовать римскую нумерацию заглавными символами;
        • a — использовать буквенную нумерацию строчными символами;
        • A — использовать буквенную нумерацию заглавными символами.

        Пример использования атрибута:

        Вид списка в браузере

        Элементы нумерованного списка

        Для выделения каждого элемента нумерованного списка используется HTML-элемент <li> (сокр. от англ. list item – «элемент списка»). Закрывающий тег элемента является необязательным и может быть опущен, если за элементом непосредственно следует другой элемент <li> или закрывающий тег </ol> . В открывающем теге элемента <li> могут присутствовать универсальные атрибуты, атрибуты событий, а также собственный атрибут value . (см. спецификацию).

        Необязательный атрибут value позволяет задать текущий порядковый номер элемента в списке. Единственное разрешённое значение этого атрибута — число, записанное арабскими цифрами, даже если список отображается с римскими цифрами или буквами. Элементы списка, которые идут после элемента с таким атрибутом, нумеруются, начиная с заданного значения.

        Потребность в атрибуте value обычно возникает, когда список на странице прерывается рисунком или каким-либо другим элементом, необходимым для иллюстрации или пояснения очередного пункта списка, например:

        В браузере это будет выглядеть так:

        Список определений

        Список определений — это список пар элементов — терминов и их описаний. На веб-страницах списки определений обычно используют при создании глоссариев, всевозможных словарей, справочников или для отображения метаданных (списка пар ключ-значение).

        Для организации списка определений используется HTML-элемент <dl> (сокр. от англ. definition list — «списка определений»). Оба тега элемента — открывающий и закрывающий — являются обязательными. В открывающем теге могут присутствовать универсальные атрибуты и атрибуты событий (см. спецификацию).

        В простейшем случае содержимым элемента <dl> могут быть группы (от нуля или более) элементов <dt> и <dd> , с помощью которых собственно и создаются отдельные элементы списка. Причём каждая группа может состоять из одного или более элементов <dt> (они содержат термины), за которым следует один или более элементов <dd> (содержат определения терминов, указанных в <dt> ). Содержимое элементов <dd> в браузере выводится с увеличенным отступом слева (см. рис. ниже).

        Пример разметки простого списка определений:

        Вид списка в браузере

        Элементы списка определений

        Для выделения каждого термина в списке определений используется HTML-элемент <dt> (сокр. от англ. definition term – «определяемый термин»). Закрывающий тег элемента является необязательным и может быть опущен, если за элементом непосредственно следует другой элемент <dt> или <dd> , или закрывающий тег </dl> . В открывающем теге элемента <dt> могут присутствовать универсальные атрибуты и атрибуты событий. (см. спецификацию).

        Для выделения каждого определения в списке определений используется HTML-элемент <dd> (сокр. от англ. definition description – «описание определения»). Закрывающий тег элемента является необязательным и может быть опущен, если за элементом непосредственно следует другой элемент <dd> или <dt> , или закрывающий тег </dl> . В открывающем теге элемента <dd> могут присутствовать универсальные атрибуты и атрибуты событий. (см. спецификацию).

        По умолчанию стилевое оформление текстового содержимого элементов <dt> не отличается от стилевого оформления текстового содержимого элементов <dd> , если не считать увеличенного отступа слева. Поэтому, чтобы сделать списки определений более наглядными, необходимо воспользоваться средствами CSS. Например:

        Вид списка в браузере:

        Многоуровневые списки

        Если какие-то пункты списка должны содержать подпункты, необходимо использовать вложенные списки. Для этого в каждый такой элемент списка, где требуются подпункты, вкладывается ещё один список, то есть в HTML-элемент <li> или <dd> вкладывается элемент <ol> или <ul> , в зависимости от того, какого типа должен быть вложенный список.

        Пример разметки многоуровневого маркированного списка:

        Как я уже сказал ранее, закрывающие теги </li> и </dd> являются необязательными и при разметке простых списков их можно опускать. При разметке же многоуровневых списков опускать закрывающие теги не стоит, так как теряется наглядность исходного кода и увеличивается вероятность появления ошибок.

        Пример разметки многоуровневого нумерованного списка:

        Двухуроневый нумерованный список

        Стилевые свойства для управления видом списка

        Установить тип нумерации и вид маркеров позволяет стилевое свойство list-style-type , которое впервые появилось в ещё стандарте CSS1. Оно применяется к таким элементам как <li> , <ol> и <ul> , а также ко всем элементам, для которых свойство display установлено в значение list-item .

        Значения свойства list-style-type зависят от того, к какому типу списка свойство применяется. Например, для установки вида маркеров в неупорядоченных списках в качестве значений могут использоваться следующие ключевые слова:

        • circle — маркер в виде окружности;
        • disc — маркер в виде круга (значение по умолчанию);
        • square — маркер в виде квадрата.

        Ключевые слова для установки типа нумерации в упорядоченных списках:

        • decimal — арабские числа (значение по умолчанию);
        • decimal-leading-zero — арабские числа с нулём впереди для цифр меньше десяти (01, 02, 03, …);
        • lower-alpha — строчные латинские буквы (a, b, c, d,…);
        • lower-greek — строчные греческие буквы (α, β, γ, δ, …);
        • lower-latin — это значение аналогично lower-alpha ;
        • lower-roman — римские числа в нижнем регистре (i, ii, iii, iv, v, …);
        • upper-alpha — заглавные латинские буквы (A, B, C, D, …);
        • upper-latin — это значение аналогично upper-alpha ;
        • upper-roman — римские числа в верхнем регистре (I, II, III, IV, V, …).

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

        • none — отменить вывод маркеров и нумерацию для списка;
        • inherit — использовать значение свойства родительского элемента.

        Для указания вида маркеров, согласно стандарту CSS3, в качестве значений свойства list-style-type можно также использовать символы Юникода и символы с клавиатуры.

        Пример использования символа «+» в качестве маркера:

        Пример использования символа Юникода в качестве значения:

        Установить изображение в качестве маркера позволяет стилевое свойство list-style-image , которое впервые появилось ещё в стандарте CSS1. Оно применяется к таким элементам как <li> , <ul> и <ol> , а также ко всем элементам, для которых свойство display установлено в значение list-item .

        В качестве значения данного свойства может использоваться абсолютный или относительный адрес файла изображения, функция градиента, либо ключевые слова:

        • none — отменить использование изображения в качестве маркера (значение по умолчанию);
        • inherit — использовать значение свойства родительского элемента.

        Примеры записи свойства:

        Установить позицию маркера или номера в списке позволяет свойство list-style-position , которое впервые появилось ещё в стандарте CSS1. Оно применяется к таким элементам как <li> , <ol> и <ul> , а также ко всем элементам, для которых свойство display установлено в значение list-item .

        Данное свойство может принимать следующие значения:

        • inside — маркер или символы нумерации являются частью текстового блока и отображаются в элементе списка. Другими словами, они обтекаются текстом;
        • outside — текст выравнивается по левому краю, а маркеры или символы нумерации размещаются за пределами (за границей) текстового блока. Значение используется по умолчанию.
        • inherit — использовать значение свойства родительского элемента.

        Пример использования свойства:

        Задать все параметры маркеров сразу позволяет обобщённое свойство list-style . Оно применяется к таким элементам как <li> , <ol> и <ul> , а также ко всем элементам, для которых свойство display установлено в значение list-item .

        • < type > — параметр, определяющий вид маркера или тип нумерации. Возможные значения параметра приводились выше при описании свойства list-style-type ;
        • < position > — параметр, определяющий позицию маркера или номера в списке. Возможные значения параметра приводились выше при описании свойства list-style-position ;
        • < image > параметр, задающий рисунок для использования в качестве маркера. Возможные значения параметра приводились выше при описании свойства list-style-image .

        Порядок следования параметров не имеет значения. Любой из них может отсутствовать.

        Примеры записи свойства:

        Цвет маркеров и номеров элементов списка совпадает с цветом текстового содержимого элементов, поскольку то и другое для тегов <ul> , <ol> и <li> устанавливается одним стилевым свойством color . Поэтому, если необходимо придать маркерам или номерам элементов списка какую-то другую окраску, придётся пойти по одному из четырёх путей.

        Во-первых, в качестве маркеров можно использовать небольшие рисунки с изображением маркеров (например, ). Создать такие рисунки можно с помощью любого простейшего графического редактора и клавиши PrintScreen .

        Пример использования изображений в качестве маркеров:

        В браузере такой список будет иметь следующий вид:

        Во-вторых, маркеры нужного цвета можно получить с помощью функций градиента (набор и порядок чередование цветов необходимо будет подобрать опытным путём), например:

        Результат в браузере:

        В-третьих, изменить цвет маркеров и номеров элементов списка можно с помощью стилевого свойства color . Однако при этом нам придётся поместить всё текстовое содержимое элементов в контейнеры <span> и описать цвет этого содержимого отдельным правилом:

        Вид списка в браузере:

        Ну и последний способ изменить цвет маркеров — это сгенерировать их с помощью псевдоэлемента ::before . Ведь цвет для генерируемого содержимого устанавливается отдельным правилом. Например:

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

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