HTML Lists

 


1. Unordered HTML List

<ul>
  <li>Orange</li>
  <li>Apple</li>
  <li>Grapes</li>
  <li>Banana</li>
  <li>Pineapple</li>
</ul>


Unordered List with type property

Types : disc, square, circle
<ul type="sqare">
  <li>Orange</li>
  <li>Apple</li>
  <li>Grapes</li>
  <li>Banana</li>
  <li>Pineapple</li>
</ul>


2. Ordered HTML List

<ol>
  <li>Orange</li>
  <li>Apple</li>
  <li>Grapes</li>
  <li>Banana</li>
  <li>Pineapple</li>
</ol>


Ordered List with type and start property

Types : A,a,i.I,1
<ol type="A" start="3">
  <li>Orange</li>
  <li>Apple</li>
  <li>Grapes</li>
  <li>Banana</li>
  <li>Pineapple</li>
</ol>

<ol type="a" start="4">
  <li>Orange</li>
  <li>Apple</li>
  <li>Grapes</li>
  <li>Banana</li>
  <li>Pineapple</li>
</ol>

<ol type="i" start="10">
  <li>Orange</li>
  <li>Apple</li>
  <li>Grapes</li>
  <li>Banana</li>
  <li>Pineapple</li>
</ol>

<ol type="I" start="100">
  <li>Orange</li>
  <li>Apple</li>
  <li>Grapes</li>
  <li>Banana</li>
  <li>Pineapple</li>
</ol>


3. HTML Discription List

<dl>
  <dt>Heading One</dt>
  <dd>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus porta nunc sem, non tincidunt 
      quam accumsan eget. Integer non cursus est. Cras eu ex odio. Suspendisse euismod laoreet 
      porttitor. Pellentesque ac sem nec dolor ullamcorper gravida.</dd>
  <dt>Heading Two</dt>
  <dd>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus porta nunc sem, non tincidunt 
      quam accumsan eget. Integer non cursus est. Cras eu ex odio. Suspendisse euismod laoreet 
      porttitor. Pellentesque ac sem nec dolor ullamcorper gravida.</dd>
  <dt>Heading Three</dt>
  <dd>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus porta nunc sem, non tincidunt 
      quam accumsan eget. Integer non cursus est. Cras eu ex odio. Suspendisse euismod laoreet 
      porttitor. Pellentesque ac sem nec dolor ullamcorper gravida.<dd>
</dl>