SlideShare a Scribd company logo
HTML-List
List
HTML offers three ways for specifying lists of information. All lists must contain one
or more list elements.
Lists may contain −
<ul> Unordered list — Used to create a list of related items, in no
particular order.
<ol> Ordered list — Used to create a list of related items, in a
specific order.
<dl> Description list — Used to create a list of terms and their
descriptions.
HTML lists allow web developers to group a set of
related items in lists.
Unordered List
“An unordered list is a collection of related items that have no special
order or sequence. “
Unordered List
An unordered list created using the < ul > element, and each list item
starts with the < li > element.
The list items in unordered lists are marked with bullets.
Here's an example: OUTPUT
<ul>
<li>Chocolate Cake</li>
<li>Black Forest Cake</li>
<li>Pineapple Cake</li>
</ul>
Chocolate Cake
Black Forest Cake
Pineapple Cake
This attribute gives the type of bullets to be used in the list.
type =’disc’ : Gives default bullet structure/ By Default
type =’square’ : Looks like solid box bullets
type =’circle’ : Gives Hollow box structure
Unordered List Attribute
<html>
<body>
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
</body>
</html>
• Coffee
• Tea
• Milk
Example:1 Output
<html>
<body>
<ul type =’square’ >
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
</body>
</html>
Coffee
Tea
Milk
Example:Square Output
<html>
<body>
<ul type =’circle >
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
</body>
</html>
o Coffee
o Tea
o Milk
Example:Circle Output
Ordered List
“An Ordered list is a collection of related items that have special order
or sequence. “
Ordered List
An Ordered list created using the < ol > element, and each list item
starts with the < li > element.
The list items in Ordered lists are marked with Numbers.
Here's an example: OUTPUT
<ol>
<li>Chocolate Cake</li>
<li>Black Forest Cake</li>
<li>Pineapple Cake</li>
</ol>
1. Chocolate Cake
2. Black Forest Cake
3. Pineapple Cake
Ordered List Attribute
Ordered Lists has Two types attribute they are following
1. “Type”
2. “Start”
1. “Type” : the type attribute Sets the numbering type (type = “type Value”).
Type Value Generated Style Sample Sequence
A Capital Letters A,B,C,D………
a Lowercase Letters a,b,c,d……….
I Capital Roman Numerals I,II,III,IV……..
i Lowercase Roman Numerals i,ii,iii,iv
1 Arabic Numberals 1,2,3,4………
<html>
<body>
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
</body>
</html>
1.Coffee
2.Tea
3.Milk
Example Output
2. “Start”
An integer to start counting from for the list items. Always an Arabic
numeral (1, 2, 3, etc.), even when the numbering type is letters or Roman
numerals.
For example, to start numbering elements from the letter "d" or the Roman
numeral "iv," use
start="4".
<html>
<body>
<ol Start = 4>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
</body>
</html>
4. Coffee
5. Tea
6. Milk
Example –”Start” Output
<html>
<body>
<ol Type = “A”>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
</body>
</html>
A. Coffee
B. Tea
C. Milk
Example –”type” Output
<html>
<body>
<ol Type = “A” Start = 3>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
</body>
</html>
C. Coffee
D. Tea
E. Milk
Example –”type+Start” Output
Description List
Description List
“A description list is a list of items with a description
or definition of each item.”
The description list is created using <dl> element. The <dl> element is used in
conjunction with the <dt> element which specify a term, and
the <dd> element which specify the term's definition.
Bread
A baked food made of flour.
Coffee
A drink made from roasted coffee beans.
<dl>
<dt>Bread</dt>
<dd>A baked food made of flour.</dd>
<dt>Coffee</dt>
<dd>A drink made from roasted coffee
beans.</dd>
</dl>
Output
Example
<html>
<body>
<dl>
<dt>Coffee</dt>
<dd>- black hot drink</dd>
<dt>Milk</dt>
<dd>- white cold drink</dd>
</dl>
</body>
</html>
Coffee
- black hot drink
Milk
- white cold drink
Example
Output
THANK
YOU

More Related Content

What's hot

Basic html structure
Basic html structureBasic html structure
Basic html structure
Jhaun Paul Enriquez
 
Html images syntax
Html images syntaxHtml images syntax
Html images syntax
JayjZens
 
Web html table tags
Web html  table tagsWeb html  table tags
Web html table tags
Kainat Ilyas
 
Cascading Style Sheet (CSS)
Cascading Style Sheet (CSS)Cascading Style Sheet (CSS)
Cascading Style Sheet (CSS)
AakankshaR
 
Html ppt
Html pptHtml ppt
Html ppt
santosh lamba
 
HTML presentation for beginners
HTML presentation for beginnersHTML presentation for beginners
HTML presentation for beginners
jeroenvdmeer
 
Html Basic Tags
Html Basic TagsHtml Basic Tags
Html Basic Tags
Richa Singh
 
HTML
HTMLHTML
Presentation on HTML
Presentation on HTMLPresentation on HTML
Presentation on HTML
satvirsandhu9
 
Html table
Html tableHtml table
Html table
JayjZens
 
Html forms
Html formsHtml forms
Html forms
Himanshu Pathak
 
Learn html Basics
Learn html BasicsLearn html Basics
Learn html Basics
McSoftsis
 
HTML Text formatting tags
HTML Text formatting tagsHTML Text formatting tags
HTML Text formatting tags
Himanshu Pathak
 
JavaScript - Chapter 11 - Events
 JavaScript - Chapter 11 - Events  JavaScript - Chapter 11 - Events
JavaScript - Chapter 11 - Events
WebStackAcademy
 
Introduction to html
Introduction to htmlIntroduction to html
Introduction to html
eShikshak
 
Basic html
Basic htmlBasic html
Javascript arrays
Javascript arraysJavascript arrays
Javascript arrays
Hassan Dar
 
Html tags or elements
Html tags or elementsHtml tags or elements
Html tags or elements
Webtech Learning
 

What's hot (20)

Basic html structure
Basic html structureBasic html structure
Basic html structure
 
Html images syntax
Html images syntaxHtml images syntax
Html images syntax
 
Web html table tags
Web html  table tagsWeb html  table tags
Web html table tags
 
Cascading Style Sheet (CSS)
Cascading Style Sheet (CSS)Cascading Style Sheet (CSS)
Cascading Style Sheet (CSS)
 
Html ppt
Html pptHtml ppt
Html ppt
 
HTML presentation for beginners
HTML presentation for beginnersHTML presentation for beginners
HTML presentation for beginners
 
MYSQL.ppt
MYSQL.pptMYSQL.ppt
MYSQL.ppt
 
Html Basic Tags
Html Basic TagsHtml Basic Tags
Html Basic Tags
 
HTML
HTMLHTML
HTML
 
Html
HtmlHtml
Html
 
Presentation on HTML
Presentation on HTMLPresentation on HTML
Presentation on HTML
 
Html table
Html tableHtml table
Html table
 
Html forms
Html formsHtml forms
Html forms
 
Learn html Basics
Learn html BasicsLearn html Basics
Learn html Basics
 
HTML Text formatting tags
HTML Text formatting tagsHTML Text formatting tags
HTML Text formatting tags
 
JavaScript - Chapter 11 - Events
 JavaScript - Chapter 11 - Events  JavaScript - Chapter 11 - Events
JavaScript - Chapter 11 - Events
 
Introduction to html
Introduction to htmlIntroduction to html
Introduction to html
 
Basic html
Basic htmlBasic html
Basic html
 
Javascript arrays
Javascript arraysJavascript arrays
Javascript arrays
 
Html tags or elements
Html tags or elementsHtml tags or elements
Html tags or elements
 

Similar to Html-list

html-list-type-description-with-examples
html-list-type-description-with-exampleshtml-list-type-description-with-examples
html-list-type-description-with-examples
203t1a0571
 
computer language - html lists
computer language - html listscomputer language - html lists
computer language - html lists
Dr. I. Uma Maheswari Maheswari
 
HTML LIST
HTML LISTHTML LIST
HTML LIST
Swetha Alle
 
Lesson-05.pptx
Lesson-05.pptxLesson-05.pptx
Lesson-05.pptx
07KhaledAymanAbdulra
 
Web topic 8 listings in html
Web topic 8  listings in htmlWeb topic 8  listings in html
Web topic 8 listings in htmlCK Yang
 
Use of Lists and Tables in HTML
Use of Lists and Tables in HTMLUse of Lists and Tables in HTML
Use of Lists and Tables in HTML
PrakritiDhang
 
Html training slide
Html training slideHtml training slide
Html training slide
villupuramtraining
 
Module 1 Creating new paragraph
Module 1   Creating new paragraphModule 1   Creating new paragraph
Module 1 Creating new paragraph
Rupert Garry Torres
 
Html list
Html listHtml list
Html list
REVTISHEVATE
 
Listing in web development and uses
Listing in web development and usesListing in web development and uses
Listing in web development and uses
Partnered Health
 
Web forms and html (lect 3)
Web forms and html (lect 3)Web forms and html (lect 3)
Web forms and html (lect 3)
Salman Memon
 
HTML ppt.pptx
HTML ppt.pptxHTML ppt.pptx
HTML ppt.pptx
Theerthasaichowdary
 
Html link and list tags
Html link and list tagsHtml link and list tags
Html link and list tags
Himanshu Pathak
 
Html web designing using lists
Html web designing using listsHtml web designing using lists
Html web designing using lists
Jesus Obenita Jr.
 
Creating lists
Creating listsCreating lists
Creating lists
nobel mujuji
 
Std 10 Computer Chapter 4 List and Table Handling in HTML(Part 1 List in HTML)
Std 10 Computer Chapter 4 List and Table Handling in HTML(Part 1 List in HTML)Std 10 Computer Chapter 4 List and Table Handling in HTML(Part 1 List in HTML)
Std 10 Computer Chapter 4 List and Table Handling in HTML(Part 1 List in HTML)
Nuzhat Memon
 
Ordered lists
Ordered listsOrdered lists
Ordered lists
Toni Norman
 

Similar to Html-list (20)

html-list-type-description-with-examples
html-list-type-description-with-exampleshtml-list-type-description-with-examples
html-list-type-description-with-examples
 
computer language - html lists
computer language - html listscomputer language - html lists
computer language - html lists
 
HTML LIST
HTML LISTHTML LIST
HTML LIST
 
Lesson-05.pptx
Lesson-05.pptxLesson-05.pptx
Lesson-05.pptx
 
Web topic 8 listings in html
Web topic 8  listings in htmlWeb topic 8  listings in html
Web topic 8 listings in html
 
Use of Lists and Tables in HTML
Use of Lists and Tables in HTMLUse of Lists and Tables in HTML
Use of Lists and Tables in HTML
 
Html training slide
Html training slideHtml training slide
Html training slide
 
Module 1 Creating new paragraph
Module 1   Creating new paragraphModule 1   Creating new paragraph
Module 1 Creating new paragraph
 
Html list
Html listHtml list
Html list
 
Listing in web development and uses
Listing in web development and usesListing in web development and uses
Listing in web development and uses
 
T.2.8.pp
T.2.8.ppT.2.8.pp
T.2.8.pp
 
Web forms and html (lect 3)
Web forms and html (lect 3)Web forms and html (lect 3)
Web forms and html (lect 3)
 
HTML ppt.pptx
HTML ppt.pptxHTML ppt.pptx
HTML ppt.pptx
 
Handout4 lists
Handout4 listsHandout4 lists
Handout4 lists
 
Html link and list tags
Html link and list tagsHtml link and list tags
Html link and list tags
 
Unit 2.5
Unit 2.5Unit 2.5
Unit 2.5
 
Html web designing using lists
Html web designing using listsHtml web designing using lists
Html web designing using lists
 
Creating lists
Creating listsCreating lists
Creating lists
 
Std 10 Computer Chapter 4 List and Table Handling in HTML(Part 1 List in HTML)
Std 10 Computer Chapter 4 List and Table Handling in HTML(Part 1 List in HTML)Std 10 Computer Chapter 4 List and Table Handling in HTML(Part 1 List in HTML)
Std 10 Computer Chapter 4 List and Table Handling in HTML(Part 1 List in HTML)
 
Ordered lists
Ordered listsOrdered lists
Ordered lists
 

More from Dhirendra Chauhan

V34 numeric function-c
V34  numeric function-cV34  numeric function-c
V34 numeric function-c
Dhirendra Chauhan
 
V33 date function-c
V33  date function-cV33  date function-c
V33 date function-c
Dhirendra Chauhan
 
V30 full join(union intersect etc)
V30  full join(union intersect etc)V30  full join(union intersect etc)
V30 full join(union intersect etc)
Dhirendra Chauhan
 
V24 cartesion product-c
V24 cartesion product-cV24 cartesion product-c
V24 cartesion product-c
Dhirendra Chauhan
 
V20 bet ween operator-c
V20 bet ween operator-cV20 bet ween operator-c
V20 bet ween operator-c
Dhirendra Chauhan
 
V15 like operator-c
V15 like operator-cV15 like operator-c
V15 like operator-c
Dhirendra Chauhan
 

More from Dhirendra Chauhan (20)

V35 keys-c
V35  keys-cV35  keys-c
V35 keys-c
 
V34 numeric function-c
V34  numeric function-cV34  numeric function-c
V34 numeric function-c
 
V33 date function-c
V33  date function-cV33  date function-c
V33 date function-c
 
V31 having
V31  havingV31  having
V31 having
 
V30 full join(union intersect etc)
V30  full join(union intersect etc)V30  full join(union intersect etc)
V30 full join(union intersect etc)
 
V29 group by-c
V29  group by-cV29  group by-c
V29 group by-c
 
V28 view
V28  viewV28  view
V28 view
 
V27 constraint
V27 constraintV27 constraint
V27 constraint
 
V26 key
V26 keyV26 key
V26 key
 
V25 sql index
V25 sql indexV25 sql index
V25 sql index
 
V24 cartesion product-c
V24 cartesion product-cV24 cartesion product-c
V24 cartesion product-c
 
V23 function-2
V23 function-2V23 function-2
V23 function-2
 
V22 function-1
V22 function-1V22 function-1
V22 function-1
 
V21 in operator
V21 in operatorV21 in operator
V21 in operator
 
V20 bet ween operator-c
V20 bet ween operator-cV20 bet ween operator-c
V20 bet ween operator-c
 
V19 join method-c
V19 join method-cV19 join method-c
V19 join method-c
 
V18 alias-c
V18 alias-cV18 alias-c
V18 alias-c
 
V17 show command-c
V17 show command-cV17 show command-c
V17 show command-c
 
V16 sql comments-c
V16 sql comments-cV16 sql comments-c
V16 sql comments-c
 
V15 like operator-c
V15 like operator-cV15 like operator-c
V15 like operator-c
 

Recently uploaded

From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
Product School
 
Mission to Decommission: Importance of Decommissioning Products to Increase E...
Mission to Decommission: Importance of Decommissioning Products to Increase E...Mission to Decommission: Importance of Decommissioning Products to Increase E...
Mission to Decommission: Importance of Decommissioning Products to Increase E...
Product School
 
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdf
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdfSmart TV Buyer Insights Survey 2024 by 91mobiles.pdf
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdf
91mobiles
 
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
Sri Ambati
 
The Art of the Pitch: WordPress Relationships and Sales
The Art of the Pitch: WordPress Relationships and SalesThe Art of the Pitch: WordPress Relationships and Sales
The Art of the Pitch: WordPress Relationships and Sales
Laura Byrne
 
How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...
Product School
 
Designing Great Products: The Power of Design and Leadership by Chief Designe...
Designing Great Products: The Power of Design and Leadership by Chief Designe...Designing Great Products: The Power of Design and Leadership by Chief Designe...
Designing Great Products: The Power of Design and Leadership by Chief Designe...
Product School
 
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
Product School
 
To Graph or Not to Graph Knowledge Graph Architectures and LLMs
To Graph or Not to Graph Knowledge Graph Architectures and LLMsTo Graph or Not to Graph Knowledge Graph Architectures and LLMs
To Graph or Not to Graph Knowledge Graph Architectures and LLMs
Paul Groth
 
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Jeffrey Haguewood
 
Assuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyesAssuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyes
ThousandEyes
 
Neuro-symbolic is not enough, we need neuro-*semantic*
Neuro-symbolic is not enough, we need neuro-*semantic*Neuro-symbolic is not enough, we need neuro-*semantic*
Neuro-symbolic is not enough, we need neuro-*semantic*
Frank van Harmelen
 
Bits & Pixels using AI for Good.........
Bits & Pixels using AI for Good.........Bits & Pixels using AI for Good.........
Bits & Pixels using AI for Good.........
Alison B. Lowndes
 
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Ramesh Iyer
 
Knowledge engineering: from people to machines and back
Knowledge engineering: from people to machines and backKnowledge engineering: from people to machines and back
Knowledge engineering: from people to machines and back
Elena Simperl
 
AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...
AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...
AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...
Product School
 
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdfFIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance
 
Search and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical FuturesSearch and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical Futures
Bhaskar Mitra
 
Connector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a buttonConnector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a button
DianaGray10
 
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
UiPathCommunity
 

Recently uploaded (20)

From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
 
Mission to Decommission: Importance of Decommissioning Products to Increase E...
Mission to Decommission: Importance of Decommissioning Products to Increase E...Mission to Decommission: Importance of Decommissioning Products to Increase E...
Mission to Decommission: Importance of Decommissioning Products to Increase E...
 
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdf
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdfSmart TV Buyer Insights Survey 2024 by 91mobiles.pdf
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdf
 
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
 
The Art of the Pitch: WordPress Relationships and Sales
The Art of the Pitch: WordPress Relationships and SalesThe Art of the Pitch: WordPress Relationships and Sales
The Art of the Pitch: WordPress Relationships and Sales
 
How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...
 
Designing Great Products: The Power of Design and Leadership by Chief Designe...
Designing Great Products: The Power of Design and Leadership by Chief Designe...Designing Great Products: The Power of Design and Leadership by Chief Designe...
Designing Great Products: The Power of Design and Leadership by Chief Designe...
 
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
 
To Graph or Not to Graph Knowledge Graph Architectures and LLMs
To Graph or Not to Graph Knowledge Graph Architectures and LLMsTo Graph or Not to Graph Knowledge Graph Architectures and LLMs
To Graph or Not to Graph Knowledge Graph Architectures and LLMs
 
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
 
Assuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyesAssuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyes
 
Neuro-symbolic is not enough, we need neuro-*semantic*
Neuro-symbolic is not enough, we need neuro-*semantic*Neuro-symbolic is not enough, we need neuro-*semantic*
Neuro-symbolic is not enough, we need neuro-*semantic*
 
Bits & Pixels using AI for Good.........
Bits & Pixels using AI for Good.........Bits & Pixels using AI for Good.........
Bits & Pixels using AI for Good.........
 
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
 
Knowledge engineering: from people to machines and back
Knowledge engineering: from people to machines and backKnowledge engineering: from people to machines and back
Knowledge engineering: from people to machines and back
 
AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...
AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...
AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...
 
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdfFIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
 
Search and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical FuturesSearch and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical Futures
 
Connector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a buttonConnector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a button
 
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
 

Html-list

  • 2. List HTML offers three ways for specifying lists of information. All lists must contain one or more list elements. Lists may contain − <ul> Unordered list — Used to create a list of related items, in no particular order. <ol> Ordered list — Used to create a list of related items, in a specific order. <dl> Description list — Used to create a list of terms and their descriptions. HTML lists allow web developers to group a set of related items in lists.
  • 4. “An unordered list is a collection of related items that have no special order or sequence. “ Unordered List An unordered list created using the < ul > element, and each list item starts with the < li > element. The list items in unordered lists are marked with bullets. Here's an example: OUTPUT <ul> <li>Chocolate Cake</li> <li>Black Forest Cake</li> <li>Pineapple Cake</li> </ul> Chocolate Cake Black Forest Cake Pineapple Cake
  • 5. This attribute gives the type of bullets to be used in the list. type =’disc’ : Gives default bullet structure/ By Default type =’square’ : Looks like solid box bullets type =’circle’ : Gives Hollow box structure Unordered List Attribute
  • 7. <html> <body> <ul type =’square’ > <li>Coffee</li> <li>Tea</li> <li>Milk</li> </ul> </body> </html> Coffee Tea Milk Example:Square Output
  • 8. <html> <body> <ul type =’circle > <li>Coffee</li> <li>Tea</li> <li>Milk</li> </ul> </body> </html> o Coffee o Tea o Milk Example:Circle Output
  • 10. “An Ordered list is a collection of related items that have special order or sequence. “ Ordered List An Ordered list created using the < ol > element, and each list item starts with the < li > element. The list items in Ordered lists are marked with Numbers. Here's an example: OUTPUT <ol> <li>Chocolate Cake</li> <li>Black Forest Cake</li> <li>Pineapple Cake</li> </ol> 1. Chocolate Cake 2. Black Forest Cake 3. Pineapple Cake
  • 11. Ordered List Attribute Ordered Lists has Two types attribute they are following 1. “Type” 2. “Start” 1. “Type” : the type attribute Sets the numbering type (type = “type Value”). Type Value Generated Style Sample Sequence A Capital Letters A,B,C,D……… a Lowercase Letters a,b,c,d………. I Capital Roman Numerals I,II,III,IV…….. i Lowercase Roman Numerals i,ii,iii,iv 1 Arabic Numberals 1,2,3,4………
  • 13. 2. “Start” An integer to start counting from for the list items. Always an Arabic numeral (1, 2, 3, etc.), even when the numbering type is letters or Roman numerals. For example, to start numbering elements from the letter "d" or the Roman numeral "iv," use start="4".
  • 14. <html> <body> <ol Start = 4> <li>Coffee</li> <li>Tea</li> <li>Milk</li> </ol> </body> </html> 4. Coffee 5. Tea 6. Milk Example –”Start” Output
  • 15. <html> <body> <ol Type = “A”> <li>Coffee</li> <li>Tea</li> <li>Milk</li> </ol> </body> </html> A. Coffee B. Tea C. Milk Example –”type” Output
  • 16. <html> <body> <ol Type = “A” Start = 3> <li>Coffee</li> <li>Tea</li> <li>Milk</li> </ol> </body> </html> C. Coffee D. Tea E. Milk Example –”type+Start” Output
  • 18. Description List “A description list is a list of items with a description or definition of each item.” The description list is created using <dl> element. The <dl> element is used in conjunction with the <dt> element which specify a term, and the <dd> element which specify the term's definition.
  • 19. Bread A baked food made of flour. Coffee A drink made from roasted coffee beans. <dl> <dt>Bread</dt> <dd>A baked food made of flour.</dd> <dt>Coffee</dt> <dd>A drink made from roasted coffee beans.</dd> </dl> Output Example
  • 20. <html> <body> <dl> <dt>Coffee</dt> <dd>- black hot drink</dd> <dt>Milk</dt> <dd>- white cold drink</dd> </dl> </body> </html> Coffee - black hot drink Milk - white cold drink Example Output