List Styles: Beautifying Lists

 

Ordered List with classses

  1. Sample of Roman list.
  2. Lorem ipsum consectetur
  3. Lorem ipsum consectetur
<ol class="romanList">
  <li>Sample of Romad list.</li>
  <li>Lorem ipsum consectetur</li>
  <li>Lorem ipsum consectetur</li>
</ol>
  1. Sample of Low Alpha list.
  2. Lorem ipsum consectetur
  3. Lorem ipsum consectetur
<ol class="lowerAlphaList">
  <li>Sample of Low Alpha list.</li>
  <li>Lorem ipsum consectetur</li>
  <li>Lorem ipsum consectetur</li>
</ol>
  1. Sample of Decimal Zero list
  2. Lorem ipsum consectetur
  3. Lorem ipsum consectetur
<ol class="decZeroList">
  <li>Sample of Decimal Zero list.</li>
  <li>Lorem ipsum consectetur</li>
  <li>Lorem ipsum consectetur</li>
</ol>

 


 

Unordered Lists with classes

  • This is a sample Arrow list.
  • Lorem ipsum dolor sit amet consectetur
  • Lorem ipsum dolor sit amet consectetur
<ul class="arrowlist">
   <li>This is a sample Arrow list.</li>
   <li>Lorem ipsum dolor sit amet consectetur</li>
   <li>Lorem ipsum dolor sit amet consectetur</li>
</ul>

  • This is a sample Star list.
  • Lorem ipsum dolor sit amet consectetur
  • Lorem ipsum dolor sit amet consectetur
<ul class="starlist">
   <li>This is a sample Star list.</li>
   <li>Lorem ipsum dolor sit amet consectetur</li>
   <li>Lorem ipsum dolor sit amet consectetur</li>
</ul>

  • This is a sample Check list.
  • Lorem ipsum dolor sit amet consectetur
  • Lorem ipsum dolor sit amet consectetur
<ul class="checklist">
   <li>This is a sample Check list.</li>
   <li>Lorem ipsum dolor sit amet consectetur</li>
   <li>Lorem ipsum dolor sit amet consectetur</li>
</ul>

  • This is a sample Cross list Red.
  • Lorem ipsum dolor sit amet consectetur
  • Lorem ipsum dolor sit amet consectetur
<ul class="crosslistRed">
   <li>This is a sample Rross list Red.</li>
   <li>Lorem ipsum dolor sit amet consectetur</li>
   <li>Lorem ipsum dolor sit amet consectetur</li>
</ul>
  • This is a sample Bullet list.
  • Lorem ipsum dolor sit amet consectetur
  • Lorem ipsum dolor sit amet consectetur
<ul class="bulletlist">
   <li>This is a sample Bullet list.</li>
   <li>Lorem ipsum dolor sit amet consectetur</li>
   <li>Lorem ipsum dolor sit amet consectetur</li>
</ul>

  • This is a sample Cross list.
  • Lorem ipsum dolor sit amet consectetur
  • Lorem ipsum dolor sit amet consectetur
<ul class="crosslist">
   <li>This is a sample Cross list.</li>
   <li>Lorem ipsum dolor sit amet consectetur</li>
   <li>Lorem ipsum dolor sit amet consectetur</li>
</ul>

  • This is a sample Add list.
  • Lorem ipsum dolor sit amet consectetur
  • Lorem ipsum dolor sit amet consectetur
<ul class="addlist">
   <li>This is a sample Add list.</li>
   <li>Lorem ipsum dolor sit amet consectetur</li>
   <li>Lorem ipsum dolor sit amet consectetur</li>
</ul>

  • This is a sample Check listGreen.
  • Lorem ipsum dolor sit amet consectetur
  • Lorem ipsum dolor sit amet consectetur
<ul class="checklistGreen">
   <li>This is a sample Check list Green.</li>
   <li>Lorem ipsum dolor sit amet consectetur</li>
   <li>Lorem ipsum dolor sit amet consectetur</li>
</ul>

About Larry

For 40 years, Larry has committed his time, heart and soul to community outreach and mentoring young people all over the city of Wilmington, Delaware.

Get More

Larry M. Morris Gallery