List bullets like 1) 2) 3) [duplicate]

Question

I need this types of bullets using CSS

1) Lorem ipsum dolor sit amet, consectetur adipisicing elit

2) Lorem ipsum dolor sit amet, consectetur adipisicing elit

3) Lorem ipsum dolor sit amet, consectetur adipisicing elit

Any one have a idea about this ?

Gonium

Answer 1

Use CSS counters. The counter-increment CSS property is used to increase the value of CSS Counters by a given value. The counter's value can be reset using the counter-reset CSS property. Try this

ol {
  counter-reset: item;
  list-style-type: none;
}

ol li:before {
  content: counter(item) ")";
  padding-right: 5px;
  counter-increment: item
}

<ol>
  <li>Lorem ipsum dolor sit amet, consectetur adipisicing elit</li>
  <li>Lorem ipsum dolor sit amet, consectetur adipisicing elit</li>
  <li>Lorem ipsum dolor sit amet, consectetur adipisicing elit</li>
</ol>

Osmo