HTML - Разметка для упорядоченного списка с номерами? - PullRequest
Новая
       2

HTML - Разметка для упорядоченного списка с номерами?

2 голосов
/ 28 января 2012

Это довольно глупый вопрос, но какую разметку я должен использовать для упорядоченного списка, в котором уже есть номера?В настоящее время я использую тег <OL>, но в моих глазах это несколько избыточно.

Разметка: 

<ol>
    <li>Chapter 1</li>
    <li>Chapter 2</li>
    <li>Chapter 3</li>
    <li>Chapter 4</li>
</ol>

Вывод: 

1. Chapter 1
2. Chapter 2
3. Chapter 3
4. Chapter 4

По какой-то причине я 'я не использую CSS, поэтому стилизация <OL> - мой последний вариант.

Ответы [ 5 ]

2 голосов
/ 28 января 2012

Это не проблема семантики;это проблема стиля.Семантически то, что вы делаете, правильно.У вас есть список элементов в определенном порядке, поэтому вы должны использовать <ol>.Тип отображаемого маркера списка является чисто эстетическим стилем и не имеет ничего общего с семантикой.

Возможно, проблема здесь заключается в неописательном названии глав.Возможно, «Глава 1» была бы лучше «Какой-то заголовок, описывающий главу»

2 голосов
/ 28 января 2012

<ol> - ваш лучший вариант с семантической точки зрения. В соответствии со спецификациями w3, вы не должны больше использовать атрибут type, а вместо этого использовать CSS-стили:

http://www.w3.org/TR/html401/struct/lists.html#type-values

Сказав это, <ol> + CSS - «лучший» вариант. Но использование <ul> вместо этого может быть «наиболее прагматичным», чтобы избежать стилизации в вашем конкретном случае.

ОБНОВЛЕНИЕ : На самом деле, атрибут type снова был «устаревшим» в HTML5:

http://dev.w3.org/html5/markup/ol.html

0 голосов
/ 28 января 2012

На самом деле <ol> означает список, который должен быть пронумерован браузером; даже спецификации W3C HTML используют его таким образом, что бы они ни говорили в своей прозе. Подробности смотрите в моем трактате Разница между элементами ul и ol в HTML . Поэтому, если вы не хотите использовать нумерацию в браузере, не используйте <ol>.

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

Это оставляет вас <div>, с class, если это необходимо. Вы можете обернуть каждый элемент внутри <div>, чтобы они начинались с новой строки, и вы можете дополнительно обернуть весь список внутри внешнего <div>, если это необходимо для стилизации или написания сценариев. Использование просто <br> между элементами - это еще один вариант, но тогда у вас нет удобного способа стилизовать элементы, если позже вы захотите это сделать.

0 голосов
/ 28 января 2012

Вместо этого можно использовать семантическую разметку неупорядоченного списка <ul>; используя этот образец: 

<ul>
    <li>Chapter 1</li>
    <li>Chapter 2</li>
    <li>Chapter 3</li>
    <li>Chapter 4</li>
</ul>

В конце концов; тем не менее, вы всегда должны использовать CSS для стилизации. Маловероятно, что вам все равно не придется стилизовать разметку, если только это не для целей диагностики или предоставления основной информации.

Технически, чтобы быть семантически верным, вы должны сохранить разметку <ol> и использовать CSS для достижения желаемого внешнего вида, но это может быть не важно в зависимости от вашей ситуации и намерений.

0 голосов
/ 28 января 2012

Используете ли вы "сброс CSS"?Возможно, вы сбрасываете стиль OL по умолчанию.

Попробуйте добавить это к вашему CSS: 

ol { list-style-type: decimal; }

Структурируйте ваш HTML следующим образом: 

<ol>
   <li>Chapter 1</li>
   <li>Chapter 2</li>
</ol>

Также убедитесьтип документа установлен правильно.Проб.следует использовать HTML5, но есть и другие варианты. 

<!doctype html>

Разница между OL и UL заключается в «Упорядоченном списке» и «Неупорядоченном списке», при необходимости используйте правильный.Если ваш список уже содержит число, вы можете просто установить list-style-type: none;в вашем css, но я бы все равно использовал OL.Мне кажется, в этом случае правильнее.

...