HTML ul tag | what an html ul tag?

HTML ul tag | what is an HTML ul tag?

Hello, guys welcome to codewithrandom blog, in this post we learn what is ul tag in HTML, ol tag, and li tag in HTML. So let's start with our first tag ul!

HTML Ul tag 

Basically where we use ul (unordered list)tag so their li tag is a must because we use ul tag and inside of ul tag we create li (list). Let see an example of how to ul tag Or li tag work together

 <ul>  
  <li>comment</li>  
  <li>share</li>  
  <li>thank for reading</li>  
 </ul>  

Output

Here you can easily see in the image that's how unordered list work with li item, first, we use ul tag then we use 3 li tags inside of ul tag and that's it for the output image

Ul tag attribute

Here we see that we get the only circle before list item so we have some type of attribute that changes that circle into a square, disk, circle.

ul tag square

 <ul type="square">  
  <li>comment</li>  
  <li>share</li>  
  <li>thank for reading</li>  
 </ul>  

Output

Here we see that we have a square before our list item because we use the type attribute in our ul tag square

ul tag disc

 <ul type="disc">  
  <li>comment</li>  
  <li>share</li>  
  <li>thank for reading</li>  
 </ul>  

Output

Here we see that we have a disc icon before our list item because we use the type attribute in our ul tag disc.

HTML Ol tag 

Html ol tag is simple like ul where ul is an unordered list there Ol is ordered list. Ol and ul have many similarities like type attributes, and also Ol tag has start attributes.

Simple Ol tag

 <ol>  
  <li>Comment</li>  
  <li>share</li>  
  <li>read more blog</li>  
 </ol>  

Output

Simple HTML Ol tag

Ol tag  attribute start

in ol tag start attribute work like from which number list start ,first you see the code so you understand what I want to say

  start attribute

 <ol start="26">  
  <li>Comment</li>  
  <li>share</li>  
  <li>read more blog</li>  
 </ol>  

output

  Ol start attribute

Ol tag type attribute 

we have a type attribute  that changes our ol tag style,we have 1,a,A, I,I type attribute. let's see how they all work.

1 type attribute 

 <ol type="1">  
  <li>Comment</li>  
  <li>share</li>  
  <li>read more blog</li>  
 </ol>  

Output

Ol a type attribute

 

 <ol type="a">  
  <li>Comment</li>  
  <li>share</li>  
  <li>read more blog</li>  
 </ol>  

Output

ol A type attribute

 <ol type="A">  
  <li>Comment</li>  
  <li>share</li>  
  <li>read more blog</li>  
 </ol>  

Output

ol I type attribute

 <ol type="i">  
  <li>Comment</li>  
  <li>share</li>  
  <li>read more blog</li>  
 </ol>  

Output

Ol I type attribute

 <ol type="I">  
  <li>Comment</li>  
  <li>share</li>  
  <li>read more blog</li>  
 </ol>  

Output

In this post, we learn what is HTML ul tag is with simple coding example HTML . If we did a mistake or any confusion please drop a comment so give a reply or help you in easy learning.

written by - codewithrandom/Anki