Это просто имя переменной, и в python принято использовать _
для переменных throwaway. Это просто указывает, что переменная цикла фактически не используется.
Это - решение, у меня есть работа в Firefox 3, Opera и Google Chrome. Список все еще отображается в IE7 (но без закрывающей квадратной скобки и чисел выравнивания по левому краю):
ol {
counter-reset: item;
margin-left: 0;
padding-left: 0;
}
li {
display: block;
margin-bottom: .5em;
margin-left: 2em;
}
li::before {
display: inline-block;
content: counter(item) ") ";
counter-increment: item;
width: 2em;
margin-left: -2em;
}
<ol>
<li>One</li>
<li>Two</li>
<li>Three</li>
<li>Four</li>
<li>Five</li>
<li>Six</li>
<li>Seven</li>
<li>Eight</li>
<li>Nine<br>Items</li>
<li>Ten<br>Items</li>
</ol>
РЕДАКТИРОВАНИЕ: Включенный несколько выравнивают, фиксируют strager
, Также там решение CSS измениться от чисел до алфавитных/римских списков вместо того, чтобы использовать атрибут типа на ol элементе.
Относятся к тип стиля списка свойство CSS. Или при использовании счетчиков второй аргумент принимает значение типа стиля списка. Например, следующее будет использовать верхнего римлянина:
li::before {
content: counter(item, upper-roman) ") ";
counter-increment: item;
/* ... */
Быстрый и грязь альтернативное решение. Можно использовать символ табуляции наряду с предварительно отформатированным текстом. Вот возможность:
<style type="text/css">
ol {
list-style-position: inside;
}
li:first-letter {
white-space: pre;
}
</style>
и Ваш HTML:
<ol>
<li> an item</li>
<li> another item</li>
...
</ol>
Примечание, что пространство между эти li
тег и beggining текста является символом табуляции (что Вы получаете при нажатии клавиши Tab в блокноте).
, Если необходимо поддерживать более старые браузеры, можно сделать это вместо этого:
<style type="text/css">
ol {
list-style-position: inside;
}
</style>
<ol>
<li><pre> </pre>an item</li>
<li><pre> </pre>another item</li>
...
</ol>
У меня есть он. Попробуйте следующее:
<html>
<head>
<style type='text/css'>
ol { counter-reset: item; }
li { display: block; }
li:before { content: counter(item) ")"; counter-increment: item;
display: inline-block; width: 50px; }
</style>
</head>
<body>
<ol>
<li>Something</li>
<li>Something</li>
<li>Something</li>
<li>Something</li>
<li>Something</li>
<li>Something</li>
<li>Something</li>
<li>Something</li>
<li>Something</li>
<li>Something</li>
<li>Something</li>
<li>Something</li>
</ol>
</body>
выгода - то, что это определенно не будет работать над более старыми или менее совместимыми браузерами: display: inline-block
очень новое свойство.
В документах говорится относительно list-style-position
: outside
, CSS1 не указывал точное местоположение поля маркера и по причинам совместимости, CSS2 остается одинаково неоднозначным. Для более точного управления полей маркера используйте маркеры.
Далее, что страница является материалом о маркерах.
Один пример:
LI:before {
display: marker;
content: "(" counter(counter) ")";
counter-increment: counter;
width: 6em;
text-align: center;
}
Одолженный и улучшенный ответ Marcus Downing . Протестированный и работы в Firefox 3 и Opera 9. Поддержки несколько строк, также.
ol {
counter-reset: item;
margin-left: 0;
padding-left: 0;
}
li {
display: block;
margin-left: 3.5em; /* Change with margin-left on li:before. Must be -li:before::margin-left + li:before::padding-right. (Causes indention for other lines.) */
}
li:before {
content: counter(item) ")"; /* Change 'item' to 'item, upper-roman' or 'item, lower-roman' for upper- and lower-case roman, respectively. */
counter-increment: item;
display: inline-block;
text-align: right;
width: 3em; /* Must be the maximum width of your list's numbers, including the ')', for compatability (in case you use a fixed-width font, for example). Will have to beef up if using roman. */
padding-right: 0.5em;
margin-left: -3.5em; /* See li comments. */
}
Числа выстраиваются в линию лучше, если Вы добавляете, что продвижение - обнуляет к числам типом стиля списка установки к:
ol { list-style-type: decimal-leading-zero; }
Я предлагаю играть с: перед атрибутом и видящий, чего можно достигнуть с ним. Это будет означать, что Ваш код действительно ограничен хорошими новыми браузерами и исключает (раздражающе большой) раздел рынка все еще с помощью мусора старые браузеры,
Что-то как следующее, которое вызывает фиксированное с на объектах. Да, я знаю, что это менее изящно для выбора ширины самостоятельно, но CSS использования для расположения похож на тайную полицейскую работу: однако хороший Ваши побуждения, это всегда становится грязным.
li:before {
content: counter(item) ") ";
counter-increment: item;
display: marker;
width: 2em;
}
, Но Вы оказываетесь перед необходимостью экспериментировать для нахождения точного решения.
Украл многое из этого из других ответов, но это работает в FF3 на меня. Это имеет upper-roman
, универсальное расположение с отступом, закрывающая квадратная скобка.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<style type="text/css">
<!--
ol {
counter-reset: item;
margin-left: 0;
padding-left: 0;
}
li {
margin-bottom: .5em;
}
li:before {
display: inline-block;
content: counter(item, upper-roman) ")";
counter-increment: item;
width: 3em;
}
-->
</style>
</head>
<body>
<ol>
<li>One</li>
<li>Two</li>
<li>Three</li>
<li>Four</li>
<li>Five</li>
<li>Six</li>
<li>Seven</li>
<li>Eight</li>
<li>Nine</li>
<li>Ten</li>
</ol>
</body>
</html>
CSS для моделирования списков здесь , но в основном:
li {
list-style-type: decimal;
list-style-position: inside;
}
Однако определенное расположение Вы, после может, вероятно, только быть достигнут путем копания во внутренностях расположения с чем-то как это (обратите внимание, что я на самом деле не попробовал его):
ol { counter-reset: item }
li { display: block }
li:before { content: counter(item) ") "; counter-increment: item }
Существует Атрибут типа , который позволяет Вам изменять стиль нумерации, однако, Вы не можете изменить точку после числа/буквы.
<ol type="a">
<li>Turn left on Maple Street</li>
<li>Turn right on Clover Court</li>
</ol>