Skip to main content

Types of HTML Lists

👉 TYPES OF HTML LIST

We have 3 types of lists in HTML

  • Order Lists
  • Unordered Lists
  • Description List
How to write a Ordered list in HTML.

<ol>
<li>Computer</li>
<li>Mouse</li>
<li>Printer</li>
<li>Monitor</li>
</ol>



We also change of type in Ordered list type:
type="1"The list items will be numbered (default)
type="A"The list items will be uppercase alphabet 
type="a"The list items with lowercase letters
type="I"The list items will be uppercase roman numbers
type="i"The list items will be numbered with lowercase roman numbers

UNORDERED LIST


<h2> Unordered lists </h2>
<ul>
<li> facebook</li>
<li>twitter</li>
<li>chatbox</li>
<li>bingo</li>
</ul>


Output:



We can also change type of Square, Circle, and disc

discSets the list item to a bullet (default)
circleSets the list item to a circle
squareSets the list item a square
noneThe list items will not be done
Example: 
<ul style="list-style-type: disc;">
<ul style="list-style-type: circle;">
<ul style="list-style-type: square;">


👓  HTML Description Lists

It is descriptive each items
<dl> tag define description <dt> define the name <dd> describe each terms:

<h3> Description Lists</h3>
<dl>
<dt>Computer</dt>
<dd> -Computer is machine to learn everything</dd>
<dt> RAM </dt>
<dd> -Random Access Memory </dd>
</dl>



✔ Thanku:
Thanku:) 

Comments

Popular posts from this blog

HTML Basic

 How to Write HTML Tags All HTML document must start with <!DOCTYPE HTML> HTML Document start with <html> and end with </html> (that's call a start tag and end tags. The visible part of the document between <body> and </body> tags. Type of Heading Tags:  HTML document contains a 6 types of heading  we are heading describe with  <h1> heading 1 </h1> tags <h2>  heading 2  </h2>   <h3>  heading 3  </h3>   <h4>  heading 4  </h4>   <h5>  heading 5  </h5>   <h6>  heading 6  </h6> Every heading have a different fonts size. Example: Do practice and Touch with our blog  

TYPE OF HTML CSS

 Types of HTML CSS To change a HTML documents style Three Types to Add CSS in HTML 1.      Inline CSS: To using by <p style> change a style of HTML Attribute.      2.     Internal CSS: by using <style> tag in the below of <head> tag.           3.    External CSS : By using <link> element in link to external CSS file. INLINE CSS We use inline CSS in a line      Example : <p style=“color:green;”> Green Text </p> Here we use inline css… INTERNAL CSS In this section we use Internal CSS.      We use <style> element under the <head> section. Example:           <style>                 p {color:green ;}                      </style> EXTERNAL CSS External CSS create a new fil...

HTML BACKGROUND IMAGES

HTML Background Images In this Blog we learn that how to change background color in HTML and how to use background element in Backgrounds. 1.     In this blog we use Internal CSS to change a background. 2.     We given a code Below in this Blog and  You can see on youtube video link here:  Click Here <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Image Background</title> <style type="text/css"> body{background-image: url(D:\mybloglogo.png); background-repeat: no-repeat; background-attachment: fixed; background-size: auto;} </style> </head> <body> <h2>What is Lorem Ipsum? </h2>  <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer ...