Ir para conteúdo
TeixeiraRamos

Uso de list-style-type

Recommended Posts

É possível usar list-style-type que contenha esse resultado:

1) vavavavavava
2) bababababab
3) nnanananananaan
4) jajajajaja

Ou seja, número com parênteses.
Obrigado

Compartilhar este post


Link para o post
Compartilhar em outros sites

Olá!

 

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


 

<ol>
  <li>vavavavavava</li>
  <li>bababababab</li>
  <li>nnanananananaan</li>
  <li>jajajajaja</li>
</ol>

 

 

Abraços!

Compartilhar este post


Link para o post
Compartilhar em outros sites

Olá

Sherck02

 

Resultado correto!!!

Muito obrigado.

 

Se desejar usa

a) vavavvavva

b) rarararara

c) yyyyyy

 

Não basta só indicar só indicar:

 

<ol type="a">
    <li>Nome</li>
    <li>Telefone</li>
    <li>Endereço</li>
    <li>País</li>

</ol>    

 

Perdão por mais essa pergunta.

Obrigado

Compartilhar este post


Link para o post
Compartilhar em outros sites

Olá,

Disponha!

 

Não, nesse caso você deve indicar o que deseja no css.

Segue o código:

Onde era:

ol > li:before {
    content: counter(list) ") ";
    counter-increment: list;
}

 

Você acrescenta ", lower-alpha"

Ficando:

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

 

Se eu quiser números romanos por exemplo, eu insiro "lower-roman" e o resultado será:

i) item

ii) item 2

iii) item 3

iv) item 4.

 

Vale dar uma olhadinha nesse site: https://www.w3.org/TR/CSS2/generate.html#counters :smile:

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar Agora

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.