htmlbulletedlist

Getting rid of a bullet for a single item

I have a bullet list and I want just a single item without a bullet. How do I do that? For example, in the following, can I get the "Cheese" with no bullet:

<ol>
  <li>Milk</li>
  <li>Cheese</li>
  <li>Goats</li>
</ol>

Many good SO threads deal with changing the entire list, but I'm interested in a specific item.

Solution

  • You can just target any of the list items with class or pseudo selectors

    Example below shows this using first-child and class 

    li:first-child,
.no-bullet {
  list-style: none;
}
    <ol>
  <li>Milk </li>
  <li class="no-bullet">Cheese </li>
  <li>Goats </li>
</ol>