SlideShare a Scribd company logo
List in web page
Used to present the information.
3 types on list:
Unordered list
Nested
Ordered list
Tags that we use to insert list in web pages are:
<UL> </UL> - unordered list
<LI> </LI> - list item -(insert between <OL> and <UL> tag)
<OL> </OL> - ordered list
Unordered lists Creates a list in which every line begin with a BULLET MARKS.
 All entries in a unordered list must be enclosed within <UL>……..</UL> tags.
 THREE bullet type:
  solid round bullet
  square bullet
  empty round bullet
 Can insert <LI> tags, which creates a line brake and insert a bullet mark at the
beginning of the line.
 Syntax:
<UL>
<LI> TEXT</LI>
<LI> TEXT </LI>
</UL>
Ordered lists
Used <OL>..</OL> tags.
Every item in an ordered list begin with a sequence number.
We can change the sequence TYPE by insert an ATTRIBUTE TYPE in
the <OL> opening tag.
Example: <OL TYPE=“ 1”>
Can insert the TYPE ATTRIBUTE into an individual <LI> tag if we
want to change the list entry only.
Example: <LI TYPE= “a”>
Nested lists
Used when we want to display the information in outline form.
Used <UL> AND < LI> tags.
Its have more than one <UL></UL>, <OL> </OL> and <LI> </LI>
tags in one page.
When we insert the new list, the browser will indent the list one level
and will change the bullet type of reflect the nesting.
Nested lists
Used when we want to display the information in outline form.
Used <UL> AND < LI> tags.
Its have more than one <UL></UL>, <OL> </OL> and <LI> </LI>
tags in one page.
When we insert the new list, the browser will indent the list one level
and will change the bullet type of reflect the nesting.

More Related Content

Viewers also liked

8 Biggest Mistakes Email Marketers Make & How to Avoid Them
8 Biggest Mistakes Email Marketers Make & How to Avoid Them8 Biggest Mistakes Email Marketers Make & How to Avoid Them
8 Biggest Mistakes Email Marketers Make & How to Avoid Them
Marketo
 
Bdd with Cucumber-jvm. Java Day, Kiev 2015
Bdd with Cucumber-jvm. Java Day, Kiev 2015Bdd with Cucumber-jvm. Java Day, Kiev 2015
Bdd with Cucumber-jvm. Java Day, Kiev 2015
TSundberg
 
ABM - The Essentials of Account Based Marketing
ABM - The Essentials of Account Based MarketingABM - The Essentials of Account Based Marketing
ABM - The Essentials of Account Based Marketing
Marketo
 
Quy trình áp dụng mã vạch danh sách container
Quy trình áp dụng mã vạch danh sách containerQuy trình áp dụng mã vạch danh sách container
Quy trình áp dụng mã vạch danh sách container
CÔNG TY TNHH MTV XUẤT NHẬP KHẨU ĐÀM VIỆT
 
Video, video
Video, videoVideo, video
OWASP TOP 10 - 2013 (정다운)
OWASP TOP 10 - 2013 (정다운)OWASP TOP 10 - 2013 (정다운)
OWASP TOP 10 - 2013 (정다운)
다운 정
 

Viewers also liked (6)

8 Biggest Mistakes Email Marketers Make & How to Avoid Them
8 Biggest Mistakes Email Marketers Make & How to Avoid Them8 Biggest Mistakes Email Marketers Make & How to Avoid Them
8 Biggest Mistakes Email Marketers Make & How to Avoid Them
 
Bdd with Cucumber-jvm. Java Day, Kiev 2015
Bdd with Cucumber-jvm. Java Day, Kiev 2015Bdd with Cucumber-jvm. Java Day, Kiev 2015
Bdd with Cucumber-jvm. Java Day, Kiev 2015
 
ABM - The Essentials of Account Based Marketing
ABM - The Essentials of Account Based MarketingABM - The Essentials of Account Based Marketing
ABM - The Essentials of Account Based Marketing
 
Quy trình áp dụng mã vạch danh sách container
Quy trình áp dụng mã vạch danh sách containerQuy trình áp dụng mã vạch danh sách container
Quy trình áp dụng mã vạch danh sách container
 
Video, video
Video, videoVideo, video
Video, video
 
OWASP TOP 10 - 2013 (정다운)
OWASP TOP 10 - 2013 (정다운)OWASP TOP 10 - 2013 (정다운)
OWASP TOP 10 - 2013 (정다운)
 

More from Tony Nguyen

Object oriented analysis
Object oriented analysisObject oriented analysis
Object oriented analysis
Tony Nguyen
 
Directory based cache coherence
Directory based cache coherenceDirectory based cache coherence
Directory based cache coherence
Tony Nguyen
 
Business analytics and data mining
Business analytics and data miningBusiness analytics and data mining
Business analytics and data mining
Tony Nguyen
 
Big picture of data mining
Big picture of data miningBig picture of data mining
Big picture of data mining
Tony Nguyen
 
Data mining and knowledge discovery
Data mining and knowledge discoveryData mining and knowledge discovery
Data mining and knowledge discovery
Tony Nguyen
 
How analysis services caching works
How analysis services caching worksHow analysis services caching works
How analysis services caching works
Tony Nguyen
 
Hardware managed cache
Hardware managed cacheHardware managed cache
Hardware managed cache
Tony Nguyen
 
Abstract data types
Abstract data typesAbstract data types
Abstract data types
Tony Nguyen
 
Optimizing shared caches in chip multiprocessors
Optimizing shared caches in chip multiprocessorsOptimizing shared caches in chip multiprocessors
Optimizing shared caches in chip multiprocessors
Tony Nguyen
 
Abstract class
Abstract classAbstract class
Abstract class
Tony Nguyen
 
Abstraction file
Abstraction fileAbstraction file
Abstraction file
Tony Nguyen
 
Concurrency with java
Concurrency with javaConcurrency with java
Concurrency with java
Tony Nguyen
 
Data structures and algorithms
Data structures and algorithmsData structures and algorithms
Data structures and algorithms
Tony Nguyen
 
Object oriented programming-with_java
Object oriented programming-with_javaObject oriented programming-with_java
Object oriented programming-with_java
Tony Nguyen
 
Cobol, lisp, and python
Cobol, lisp, and pythonCobol, lisp, and python
Cobol, lisp, and python
Tony Nguyen
 
Extending burp with python
Extending burp with pythonExtending burp with python
Extending burp with python
Tony Nguyen
 

More from Tony Nguyen (20)

Object oriented analysis
Object oriented analysisObject oriented analysis
Object oriented analysis
 
Directory based cache coherence
Directory based cache coherenceDirectory based cache coherence
Directory based cache coherence
 
Business analytics and data mining
Business analytics and data miningBusiness analytics and data mining
Business analytics and data mining
 
Big picture of data mining
Big picture of data miningBig picture of data mining
Big picture of data mining
 
Data mining and knowledge discovery
Data mining and knowledge discoveryData mining and knowledge discovery
Data mining and knowledge discovery
 
Cache recap
Cache recapCache recap
Cache recap
 
How analysis services caching works
How analysis services caching worksHow analysis services caching works
How analysis services caching works
 
Hardware managed cache
Hardware managed cacheHardware managed cache
Hardware managed cache
 
Abstract data types
Abstract data typesAbstract data types
Abstract data types
 
Optimizing shared caches in chip multiprocessors
Optimizing shared caches in chip multiprocessorsOptimizing shared caches in chip multiprocessors
Optimizing shared caches in chip multiprocessors
 
Abstract class
Abstract classAbstract class
Abstract class
 
Abstraction file
Abstraction fileAbstraction file
Abstraction file
 
Object model
Object modelObject model
Object model
 
Concurrency with java
Concurrency with javaConcurrency with java
Concurrency with java
 
Data structures and algorithms
Data structures and algorithmsData structures and algorithms
Data structures and algorithms
 
Inheritance
InheritanceInheritance
Inheritance
 
Object oriented programming-with_java
Object oriented programming-with_javaObject oriented programming-with_java
Object oriented programming-with_java
 
Cobol, lisp, and python
Cobol, lisp, and pythonCobol, lisp, and python
Cobol, lisp, and python
 
Extending burp with python
Extending burp with pythonExtending burp with python
Extending burp with python
 
Api crash
Api crashApi crash
Api crash
 

Recently uploaded

PCI PIN Basics Webinar from the Controlcase Team
PCI PIN Basics Webinar from the Controlcase TeamPCI PIN Basics Webinar from the Controlcase Team
PCI PIN Basics Webinar from the Controlcase Team
ControlCase
 
Generative AI Deep Dive: Advancing from Proof of Concept to Production
Generative AI Deep Dive: Advancing from Proof of Concept to ProductionGenerative AI Deep Dive: Advancing from Proof of Concept to Production
Generative AI Deep Dive: Advancing from Proof of Concept to Production
Aggregage
 
20240607 QFM018 Elixir Reading List May 2024
20240607 QFM018 Elixir Reading List May 202420240607 QFM018 Elixir Reading List May 2024
20240607 QFM018 Elixir Reading List May 2024
Matthew Sinclair
 
GraphSummit Singapore | The Art of the Possible with Graph - Q2 2024
GraphSummit Singapore | The Art of the  Possible with Graph - Q2 2024GraphSummit Singapore | The Art of the  Possible with Graph - Q2 2024
GraphSummit Singapore | The Art of the Possible with Graph - Q2 2024
Neo4j
 
DevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA ConnectDevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA Connect
Kari Kakkonen
 
GridMate - End to end testing is a critical piece to ensure quality and avoid...
GridMate - End to end testing is a critical piece to ensure quality and avoid...GridMate - End to end testing is a critical piece to ensure quality and avoid...
GridMate - End to end testing is a critical piece to ensure quality and avoid...
ThomasParaiso2
 
PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)
Ralf Eggert
 
GraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge GraphGraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge Graph
Guy Korland
 
Elizabeth Buie - Older adults: Are we really designing for our future selves?
Elizabeth Buie - Older adults: Are we really designing for our future selves?Elizabeth Buie - Older adults: Are we really designing for our future selves?
Elizabeth Buie - Older adults: Are we really designing for our future selves?
Nexer Digital
 
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
 
UiPath Test Automation using UiPath Test Suite series, part 4
UiPath Test Automation using UiPath Test Suite series, part 4UiPath Test Automation using UiPath Test Suite series, part 4
UiPath Test Automation using UiPath Test Suite series, part 4
DianaGray10
 
State of ICS and IoT Cyber Threat Landscape Report 2024 preview
State of ICS and IoT Cyber Threat Landscape Report 2024 previewState of ICS and IoT Cyber Threat Landscape Report 2024 preview
State of ICS and IoT Cyber Threat Landscape Report 2024 preview
Prayukth K V
 
Climate Impact of Software Testing at Nordic Testing Days
Climate Impact of Software Testing at Nordic Testing DaysClimate Impact of Software Testing at Nordic Testing Days
Climate Impact of Software Testing at Nordic Testing Days
Kari Kakkonen
 
Communications Mining Series - Zero to Hero - Session 1
Communications Mining Series - Zero to Hero - Session 1Communications Mining Series - Zero to Hero - Session 1
Communications Mining Series - Zero to Hero - Session 1
DianaGray10
 
GraphSummit Singapore | The Future of Agility: Supercharging Digital Transfor...
GraphSummit Singapore | The Future of Agility: Supercharging Digital Transfor...GraphSummit Singapore | The Future of Agility: Supercharging Digital Transfor...
GraphSummit Singapore | The Future of Agility: Supercharging Digital Transfor...
Neo4j
 
Microsoft - Power Platform_G.Aspiotis.pdf
Microsoft - Power Platform_G.Aspiotis.pdfMicrosoft - Power Platform_G.Aspiotis.pdf
Microsoft - Power Platform_G.Aspiotis.pdf
Uni Systems S.M.S.A.
 
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
DanBrown980551
 
Essentials of Automations: The Art of Triggers and Actions in FME
Essentials of Automations: The Art of Triggers and Actions in FMEEssentials of Automations: The Art of Triggers and Actions in FME
Essentials of Automations: The Art of Triggers and Actions in FME
Safe Software
 
Monitoring Java Application Security with JDK Tools and JFR Events
Monitoring Java Application Security with JDK Tools and JFR EventsMonitoring Java Application Security with JDK Tools and JFR Events
Monitoring Java Application Security with JDK Tools and JFR Events
Ana-Maria Mihalceanu
 
Secstrike : Reverse Engineering & Pwnable tools for CTF.pptx
Secstrike : Reverse Engineering & Pwnable tools for CTF.pptxSecstrike : Reverse Engineering & Pwnable tools for CTF.pptx
Secstrike : Reverse Engineering & Pwnable tools for CTF.pptx
nkrafacyberclub
 

Recently uploaded (20)

PCI PIN Basics Webinar from the Controlcase Team
PCI PIN Basics Webinar from the Controlcase TeamPCI PIN Basics Webinar from the Controlcase Team
PCI PIN Basics Webinar from the Controlcase Team
 
Generative AI Deep Dive: Advancing from Proof of Concept to Production
Generative AI Deep Dive: Advancing from Proof of Concept to ProductionGenerative AI Deep Dive: Advancing from Proof of Concept to Production
Generative AI Deep Dive: Advancing from Proof of Concept to Production
 
20240607 QFM018 Elixir Reading List May 2024
20240607 QFM018 Elixir Reading List May 202420240607 QFM018 Elixir Reading List May 2024
20240607 QFM018 Elixir Reading List May 2024
 
GraphSummit Singapore | The Art of the Possible with Graph - Q2 2024
GraphSummit Singapore | The Art of the  Possible with Graph - Q2 2024GraphSummit Singapore | The Art of the  Possible with Graph - Q2 2024
GraphSummit Singapore | The Art of the Possible with Graph - Q2 2024
 
DevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA ConnectDevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA Connect
 
GridMate - End to end testing is a critical piece to ensure quality and avoid...
GridMate - End to end testing is a critical piece to ensure quality and avoid...GridMate - End to end testing is a critical piece to ensure quality and avoid...
GridMate - End to end testing is a critical piece to ensure quality and avoid...
 
PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)
 
GraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge GraphGraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge Graph
 
Elizabeth Buie - Older adults: Are we really designing for our future selves?
Elizabeth Buie - Older adults: Are we really designing for our future selves?Elizabeth Buie - Older adults: Are we really designing for our future selves?
Elizabeth Buie - Older adults: Are we really designing for our future selves?
 
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
 
UiPath Test Automation using UiPath Test Suite series, part 4
UiPath Test Automation using UiPath Test Suite series, part 4UiPath Test Automation using UiPath Test Suite series, part 4
UiPath Test Automation using UiPath Test Suite series, part 4
 
State of ICS and IoT Cyber Threat Landscape Report 2024 preview
State of ICS and IoT Cyber Threat Landscape Report 2024 previewState of ICS and IoT Cyber Threat Landscape Report 2024 preview
State of ICS and IoT Cyber Threat Landscape Report 2024 preview
 
Climate Impact of Software Testing at Nordic Testing Days
Climate Impact of Software Testing at Nordic Testing DaysClimate Impact of Software Testing at Nordic Testing Days
Climate Impact of Software Testing at Nordic Testing Days
 
Communications Mining Series - Zero to Hero - Session 1
Communications Mining Series - Zero to Hero - Session 1Communications Mining Series - Zero to Hero - Session 1
Communications Mining Series - Zero to Hero - Session 1
 
GraphSummit Singapore | The Future of Agility: Supercharging Digital Transfor...
GraphSummit Singapore | The Future of Agility: Supercharging Digital Transfor...GraphSummit Singapore | The Future of Agility: Supercharging Digital Transfor...
GraphSummit Singapore | The Future of Agility: Supercharging Digital Transfor...
 
Microsoft - Power Platform_G.Aspiotis.pdf
Microsoft - Power Platform_G.Aspiotis.pdfMicrosoft - Power Platform_G.Aspiotis.pdf
Microsoft - Power Platform_G.Aspiotis.pdf
 
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
 
Essentials of Automations: The Art of Triggers and Actions in FME
Essentials of Automations: The Art of Triggers and Actions in FMEEssentials of Automations: The Art of Triggers and Actions in FME
Essentials of Automations: The Art of Triggers and Actions in FME
 
Monitoring Java Application Security with JDK Tools and JFR Events
Monitoring Java Application Security with JDK Tools and JFR EventsMonitoring Java Application Security with JDK Tools and JFR Events
Monitoring Java Application Security with JDK Tools and JFR Events
 
Secstrike : Reverse Engineering & Pwnable tools for CTF.pptx
Secstrike : Reverse Engineering & Pwnable tools for CTF.pptxSecstrike : Reverse Engineering & Pwnable tools for CTF.pptx
Secstrike : Reverse Engineering & Pwnable tools for CTF.pptx
 

List in webpage

  • 1.
  • 2. List in web page Used to present the information. 3 types on list: Unordered list Nested Ordered list Tags that we use to insert list in web pages are: <UL> </UL> - unordered list <LI> </LI> - list item -(insert between <OL> and <UL> tag) <OL> </OL> - ordered list
  • 3. Unordered lists Creates a list in which every line begin with a BULLET MARKS.  All entries in a unordered list must be enclosed within <UL>……..</UL> tags.  THREE bullet type:   solid round bullet   square bullet   empty round bullet  Can insert <LI> tags, which creates a line brake and insert a bullet mark at the beginning of the line.  Syntax: <UL> <LI> TEXT</LI> <LI> TEXT </LI> </UL>
  • 4. Ordered lists Used <OL>..</OL> tags. Every item in an ordered list begin with a sequence number. We can change the sequence TYPE by insert an ATTRIBUTE TYPE in the <OL> opening tag. Example: <OL TYPE=“ 1”> Can insert the TYPE ATTRIBUTE into an individual <LI> tag if we want to change the list entry only. Example: <LI TYPE= “a”>
  • 5. Nested lists Used when we want to display the information in outline form. Used <UL> AND < LI> tags. Its have more than one <UL></UL>, <OL> </OL> and <LI> </LI> tags in one page. When we insert the new list, the browser will indent the list one level and will change the bullet type of reflect the nesting.
  • 6. Nested lists Used when we want to display the information in outline form. Used <UL> AND < LI> tags. Its have more than one <UL></UL>, <OL> </OL> and <LI> </LI> tags in one page. When we insert the new list, the browser will indent the list one level and will change the bullet type of reflect the nesting.