¿Lista ordenada (HTML) alfa inferior con paréntesis a la derecha?

El tipo de lista de alfa inferior predeterminado para la lista ordenada utiliza un punto '.'. ¿Hay alguna manera de usar un paréntesis correcto en lugar de a) ... b) ..etc?

Aquí tienes una buena solución. (Honestamente, me sorprendí a mí mismo con esto). CSS tiene algo llamado contadores , donde puede establecer, por ejemplo, números de capítulo automáticos en cada título. Un poco de modificación le da lo siguiente; Deberá resolver el relleno, etc. usted mismo.

ol {
  counter-reset: list;
}
ol > li {
  list-style: none;
}
ol > li:before {
  content: counter(list, lower-alpha) ") ";
  counter-increment: list;
}

<span>custom list style type (v1):</span>
<ol>
  <li>Number 1</li>
  <li>Number 2</li>
  <li>Number 3</li>
  <li>Number 4</li>
  <li>Number 5</li>
  <li>Number 6</li>
</ol>

Funciona en todos los navegadores modernos e IE9 + (y posiblemente IE8, pero puede tener errores).

Actualización: agregué un selector secundario para evitar que las listas anidadas recojan el estilo principal. trejder también menciona un buen punto en los comentarios de que la alineación de los elementos de la lista también está desordenada. Un artículo sobre 456bereastreet tiene una buena solución que implica posicionar absolutamente el mostrador.

ol {
    counter-reset: list;
}
ol > li {
    list-style: none;
    position: relative;
}
ol > li:before {
    counter-increment: list;
    content: counter(list, lower-alpha) ") ";
    position: absolute;
    left: -1.4em;
}

<span>custom list style type (v2):</span>
<ol>
  <li>Number 1</li>
  <li>Number 2</li>
  <li>Number 3</li>
  <li>Number 4</li>
  <li>Number 5</li>
  <li>Number 6</li>
</ol>

Aquí hay un jsFiddle que muestra el resultado, incluidas las listas anidadas.

Partiendo de la respuesta de DisgruntledGoat, la expandí para admitir sublistas y estilos según lo necesitaba. Compartiéndolo aquí en caso de que ayude a alguien.

https://jsfiddle.net/0a8992b9/ salidas:

(i)first roman
    (a)first alpha
    (b)second alpha
    (c)third alpha
    (d)fourth alpha
(ii)second roman
(iii)third roman
    (a)first alpha
    (b)second alpha

Agregar esto al CSS dio algunos resultados interesantes. Estuvo cerca, pero no puro.

li:before {
    display: inline-block;
    width: 1em; 
    position: relative;
    left: -0.5em; 
    content: ')'
}

----- Editado para incluir la solución de Iazel, en los comentarios -----

He perfeccionado tu solución:

li {
    position: relative;
}
li:before {
    display: inline-block;
    width: 7px;
    position: absolute;
    left: -12px;
    content: ')';
    background-color: #FFF;
    text-align: center;
}

El fondo y position: absoluteel truco!

Esto me funciona en IE7, FF3.6, Opera 9.64 y Chrome 6.0.4:

<ol start="a" type="a" style="font-weight: normal;">
<li><span style="inline-block;margin-left: -9px !important; margin-left: -15px;">) &nbsp;</span> content for line number one;</li>
<li><span style="inline-block;margin-left: -9px !important; margin-left: -15px;">) &nbsp;</span>  content for line number two;</li>
<li><span style="inline-block;margin-left: -9px !important; margin-left: -15px;">) &nbsp;</span>  content for line number three;</li> 
<li><span style="inline-block;margin-left: -9px !important; margin-left: -15px;">) &nbsp;</span>  content for line number four;</li>
<li><span style="inline-block;margin-left: -9px !important; margin-left: -15px;">) &nbsp;</span>  content for line number five;</li>
<li><span style="inline-block;margin-left: -9px !important; margin-left: -15px;">) &nbsp;</span>  content for line number six;</li>
</ol>

esto está en línea porque está codificado para un correo electrónico, pero el punto principal es que el intervalo actúa como un bloque de contenido y lleva a los pares al territorio izquierdo negativo para que se alinee con los números de la lista. los dos márgenes son para compensar las diferencias de IE7 y FF

espero que esto ayude.