Home

How to Create Bulleted Lists in HTML5

|
|  Updated:  
2016-03-26 14:03:52
HTML5 and CSS3 All-in-One For Dummies
Explore Book
Buy On Amazon

A bulleted list contains one or more items each prefaced by a bullet (often a big dot). Use this kind of list on your web page if the items’ order isn’t necessary for understanding the information it presents.

A bulleted list requires the following:

  • The unordered list element (

      ) specifies a bulleted list.

    • A list item element (

    • ) marks each item in the list.

    • The closing tag for the unordered list element (

    ) indicates that the list has come to its end.

    An unordered list (another name for bulleted list) with three items requires elements and content in the following order:

      • Content for the first list item

      • Content for the second list item

      • Content for the third list item

      The following markup formats a three-item list as a bulleted list:

      <!DOCTYPE html>
      <html>
        <head>
          <meta charset="UTF-8">
          <title>Bulleted Lists</title>
        </head>
        <body>
          <h1>Things to do today</h1>
          <ul>
            <li>Feed cat</li>
            <li>Wash car</li>
            <li>Grocery shopping</li>
          </ul>
        </body>
      </html>

      This figure shows how a browser renders this with bullets.

      image0.jpg

      Use CSS to exert more control over the formatting of your lists, including the ability to use your own graphics as bullet symbols.

      About This Article

      This article is from the book: 

      About the book author:

      Ed Tittel is a 28-year veteran of the computer industry. A seasoned author and consultant, Ed has more than 140 books to his credit.

      Chris Minnick is an accomplished author, teacher, and programmer. Minnick authored or co-authored over 20 books, including titles in the For Dummies series. He has developed video courses for top online training platforms and he teaches programming and machine learning to professional developers at some of the largest global companies.