Bootstrap offers support and styling for the three main list types that HTML offers: ordered, unordered, and definition lists. An unordered list is a list that doesn’t have any particular order and is traditionally styled with bullets.
If you have an ordered list that you would like to remove the bullets from, add class="unstyled" to the opening <ul> tag.
<!DOCTYPE html> <html> <head> <title>Bootstrap Tutorial</title> <link href="css/bootstrap.min.css" rel="stylesheet"> </head> <body> <body> <h3>Favorite Outdoor Activities</h3> <ul> <li>Backpacking in Yosemite</li> <li>Hiking in Arches <ul> <li>Delicate Arch</li> <li>Park Avenue</li> </ul> </li> <li>Biking the Flintstones Trail</li> </ul> </body> </html>
The third type of list you get with Bootstrap is the definition list. The definition list differs from the ordered and unordered list in that instead of just having a block-level <li> element, each list item can consist of both the <dt> and the <dd> elements. <dt> stands for “definition term,” and like a dictionary, this is the term (or phrase) that is being defined. Subsequently, the <dd> is the definition of the <dt>.
A lot of times in markup, you will see people using headings inside an unordered list. This works, but may not be the most semantic way to mark up the text. A better method would be creating a <dl> and then styling the <dt> and <dd> as you would the heading and the text. That being said, Bootstrap offers some clean default styles and an option for a side-by-side layout of each definition:
<!DOCTYPE html> <html> <head> <title>Bootstrap Tutorial</title> <link href="css/bootstrap.min.css" rel="stylesheet"> </head> <body> <body> <h3>Common Electronics Parts</h3> <dl> <dt>LED</dt> <dd>A light-emitting diode (LED) is a semiconductor light source.</dd> <dt>Servo</dt> <dd>Servos are small, cheap, mass-produced actuators used for radio control and small robotics.</dd> </dl> </body> </html>