In some situations, you may want to create a bullet list with no bullets or a list items with no bullets. To create an ordered list or unordered list with no bullets (hide the bullets), follow the steps below.

HTML example

Adding the “list-style: none” CSS class to the unordered list (

    ) or ordered list (
      ) tag removes any bullet or number.

      • List item with no bullet
      • Second item

      HTML with CSS example

      Although the above example works in almost every situation, it is better to have the CSS in a separate, external file. Below is the CSS and HTML that removes bullets.

      Using the CSS below removes bullets from all unordered links (

        ). This CSS can be useful if you have no intentions of using bullets or want to use an image instead of a bullet.

        If you only intend to have one list, not have bullets or numbers, it’s a better idea to create a class to be used anytime you do not want bullets:

        In the above CSS, a new class called “nobull” is created. This class can then be used anytime you do not want a bullet as shown in the example below.

        • List item with no bullet
        • Second item

        Example output

        Below is an example of how the output for an unordered bullet list appears without its bullets.

        You could also apply this class to any of the list items (

      • ) to removed bullets from some, while keeping the other bullets unchanged.

        • List item with no bullet
        • Second item
        • How to create a bullet and number list in HTML.
        • See the bullet list definition for further information and related links.
        • HTML and web design help and support.