Bootstrap Lists and Blockquotes

Bootstrap provides styling classes for lists and blockquotes, which can be used to customize the appearance of these elements.

Lists

The two most commonly used list classes are list-unstyled and list-inline.

An unstyled list will remove the default list-style and margin from direct list items. Any nested lists will be unaffected.

<ul class="list-unstyled">
  <li>Lorem ipsum dolor sit amet</li>
  <li>Consectetur adipiscing elit</li>
  <li>Integer molestie lorem at massa</li>
  <li>Facilisis in pretium nisl aliquet</li>
  <li>Nulla volutpat aliquam velit
    <ul>
      <li>Phasellus iaculis neque</li>
      <li>Purus sodales ultricies</li>
      <li>Vestibulum laoreet porttitor sem</li>
      <li>Ac tristique libero volutpat at</li>
    </ul>
  </li>
  <li>Faucibus porta lacus fringilla vel</li>
  <li>Aenean sit amet erat nunc</li>
  <li>Eget porttitor lorem</li>
</ul>

Blockquotes

Blockquotes are commonly used for quoting text from another source. Bootstrap includes the class .blockquote to customize the blockquote element. For identifying the source of a quote, the footer tag with the class .blockquote-footer can be used.

<blockquote class="blockquote">
  <p class="mb-0">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
  <footer class="blockquote-footer">Someone famous in <cite title="Source Title">Source Title</cite></footer>
</blockquote>