A display of various lists in the framework.
A bulleted list of unordered items
<ul>
<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>A ordered list of items
<ol>
<li>Lorem ipsum dolor sit amet</li>
<li>Consectetur adipiscing elit
<ol>
<li>Phasellus iaculis neque</li>
<li>Purus sodales ultricies</li>
<li>Vestibulum laoreet porttitor sem</li>
<li>Ac tristique libero volutpat at</li>
</ol>
</li>
<li>Faucibus porta lacus fringilla vel</li>
<li>Aenean sit amet erat nunc</li>
<li>Eget porttitor lorem</li>
</ol>Example of combining ordered list elements
<ol>
<li>Lorem ipsum</li>
<li>Consectetur
<ul>
<li>Iaculis</li>
<li>Purus</li>
<li>Vestibulum </li>
<li>Tristique</li>
</ul>
</li>
<li>Faucibus</li>
<li>Aenean </li>
<li>Eget</li>
</ol><ul>
<li>Lorem ipsum</li>
<li>Consectetur
<ol>
<li>Iaculis</li>
<li>Purus</li>
<li>Vestibulum</li>
<li>Ac tristique</li>
</ol>
</li>
<li>Faucibus</li>
<li>Aenean</li>
<li>Eget</li>
</ul>A list of terms with their associated descriptions
<dl>
<dt>Definition 1</dt>
<dd>Pellentesque habitant morbi tristique senectus et netus et malesuada fames</dd>
<dt>Definition 2</dt>
<dd>Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.</dd>
<dd>Donec id elit non mi porta gravida at eget metus.</dd>
<dt>Definition 3</dt>
<dd>Etiam porta sem malesuada magna mollis euismod.</dd>
</dl>Test of lists with paragraphs
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Magni, facilis, recusandae, consequatur, tempora mollitia porro quos corporis odit impedit odio magnam libero tempore animi a incidunt laudantium eum. Nostrum, natus?
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Unde, quae nam laborum debitis facere quod nemo vitae reiciendis quidem odio voluptate eos molestias doloribus qui sapiente consequuntur odit deleniti quisquam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laboriosam, eos, soluta distinctio facilis assumenda amet quidem optio ea perspiciatis debitis reiciendis temporibus corporis veritatis at aperiam! Ad reiciendis adipisci error.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quo, odit, maiores, et soluta nisi tempora nulla alias ab illum ducimus assumenda reprehenderit reiciendis perferendis veniam minus similique quod id odio.
<div class="wrap-for-example">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Magni, facilis, recusandae, consequatur, tempora mollitia porro quos corporis odit impedit odio magnam libero tempore animi a incidunt laudantium eum. Nostrum, natus?</p>
<ul>
<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>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Unde, quae nam laborum debitis facere quod nemo vitae reiciendis quidem odio voluptate eos molestias doloribus qui sapiente consequuntur odit deleniti quisquam.</p>
<ol>
<li>Lorem ipsum dolor sit amet</li>
<li>Consectetur adipiscing elit
<ol>
<li>Phasellus iaculis neque</li>
<li>Purus sodales ultricies</li>
<li>Vestibulum laoreet porttitor sem</li>
<li>Ac tristique libero volutpat at</li>
</ol>
</li>
<li>Faucibus porta lacus fringilla vel</li>
<li>Aenean sit amet erat nunc</li>
<li>Eget porttitor lorem</li>
</ol>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laboriosam, eos, soluta distinctio facilis assumenda amet quidem optio ea perspiciatis debitis reiciendis temporibus corporis veritatis at aperiam! Ad reiciendis adipisci error.</p>
<dl>
<dt>Definition 1</dt>
<dd>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante.</dd>
<dt>Definition 2</dt>
<dd>Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.</dd>
<dd>Donec id elit non mi porta gravida at eget metus.</dd>
<dt>Definition 3</dt>
<dd>Etiam porta sem malesuada magna mollis euismod.</dd>
</dl>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quo, odit, maiores, et soluta nisi tempora nulla alias ab illum ducimus assumenda reprehenderit reiciendis perferendis veniam minus similique quod id odio.</p>
</div>Removes styling from list items
<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>All list items are setup with display: inline-block
<ul class="list-inline">
<li>Lorem ipsum dolor sit amet</li>
<li>Consectetur adipiscing elit</li>
<li>Integer molestie lorem at massa</li>
</ul>Remove the icon for a list
<ul class="no-icon">
<li>Lorem ipsum dolor sit amet</li>
<li>Consectetur adipiscing elit</li>
<li>Integer molestie lorem at massa</li>
</ul>