Требуется нижний римский список с круглыми скобками

Question

Мне нужно сгенерировать выходные данные с помощью css ...

(i) Каков спрос?

(ii) Для какого сегмента (сегментов)?

(III) с учетом инновационной ...

(IV) Учитывая инновационные ...

... и так далее.

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

Answer 1

Вы можете добиться этого с counter-increment собственности .WRITE, как это:

ul{ 
    counter-reset:item; 
    list-style:none; 
} 
li:before  { 
    content: "("counter(item, lower-roman) ")"; 
    counter-increment: item; 
} 

Проверить этот http://jsfiddle.net/MEBxA/

Это работа до IE8 & выше.

Answer 2

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

1. Подавить по умолчанию нумерация с list-style: none и генерировать числа, использующие счетчики, сгенерированный контент и псевдоэлемент :before (как в ответе песчаника).
2. Включите номера в контент, используя методы на стороне сервера, чтобы сгенерировать их. Либо подавите нумерацию по умолчанию для ul, либо (несколько более безопасную) не используйте разметку ul, но, к примеру, div элементов или table разметки.

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

(i) What is the demand?<br> 
(ii) For what segment(s)?<br> 
… 

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

<div class=ol> 
<div class=li><span class=num>(i)</span> What is the demand?</div> 
<div class=li><span class=num>(ii)</span> For what segment(s)?</div> 
… 
</div> 

(Использование и не div как внешняя разметка бы значительно улучшить запасной вариант, рендеринг т.е. не CSS, но это, вероятно, вызовет Accu «0».