SlideShare a Scribd company logo
1 of 9
Block level HTML Tags
UNDERSTANDING STRUCTURE
IN HTML
Introduction to Block-Level Tags
•Definition: Block-level elements create structural blocks in HTML.
•Behavior: These elements start on a new line and occupy the full available
width by default.
•Examples: Show examples of block-level tags (e.g., <div>, <p>, <h1>-<h6>,
<ul>, <ol>, <table>, etc.).
Divisions with <div>
•Definition: <div> is a versatile container used for grouping
content.
•Purpose: It helps organize and structure content for styling
or layout purposes.
•Example: Illustrate how <div> can enclose various
elements within a block.
Paragraphs with
<p>
•Definition: <p> represents a paragraph of text.
•Usage: Ideal for separating and formatting blocks of te
•Example: Show usage of <p> tags with text content.
Headings with <h1> to <h6>
•Definition: <h1> to <h6> represent different levels of
headings.
•Semantic Hierarchy: Explain the hierarchy and importance
of these headings.
•Example: Show different headings and their usage.
Lists - <ul> and <ol> with <li>
•Definition: <ul> creates unordered lists, <ol> creates
ordered lists, <li> denotes list items.
•Usage: Explain when to use each type of list.
•Example: Show both types of lists with list ite
Table Structure with <table>, <tr>, <th>, <td>
•Definition: <table> creates a table structure; <tr>
represents table rows; <th> denotes table header cells;
<td> represents regular table cells.
•Usage: Describe the structure of tables using these
elements.
•Example: Display a simple table structure with rows and
cells.
Block level HTML Tags.pptx Block level HTML Tags.pptx Block level HTML Tags.pptx Block level HTML Tags.pptx Block level HTML Tags.pptx
Block level HTML Tags.pptx Block level HTML Tags.pptx Block level HTML Tags.pptx Block level HTML Tags.pptx Block level HTML Tags.pptx

More Related Content

Similar to Block level HTML Tags.pptx Block level HTML Tags.pptx Block level HTML Tags.pptx Block level HTML Tags.pptx Block level HTML Tags.pptx

Castro Chapter 3
Castro Chapter 3Castro Chapter 3
Castro Chapter 3
Jeff Byrnes
 
Ifi7174 lesson2
Ifi7174 lesson2Ifi7174 lesson2
Ifi7174 lesson2
Sónia
 
Intro to HTML5
Intro to HTML5Intro to HTML5
Intro to HTML5
Vlad Posea
 

Similar to Block level HTML Tags.pptx Block level HTML Tags.pptx Block level HTML Tags.pptx Block level HTML Tags.pptx Block level HTML Tags.pptx (20)

Css
CssCss
Css
 
lecture CSS 1-2_2022_2023.pptx
lecture CSS 1-2_2022_2023.pptxlecture CSS 1-2_2022_2023.pptx
lecture CSS 1-2_2022_2023.pptx
 
CSS
CSSCSS
CSS
 
basic programming language AND HTML CSS JAVApdf
basic programming language AND HTML CSS JAVApdfbasic programming language AND HTML CSS JAVApdf
basic programming language AND HTML CSS JAVApdf
 
Introduction to css
Introduction to cssIntroduction to css
Introduction to css
 
Introduction to HTML and CSS
Introduction to HTML and CSSIntroduction to HTML and CSS
Introduction to HTML and CSS
 
ppt.ppt
ppt.pptppt.ppt
ppt.ppt
 
Shreyansh_patni web developer
Shreyansh_patni web developerShreyansh_patni web developer
Shreyansh_patni web developer
 
DHTML
DHTMLDHTML
DHTML
 
Castro Chapter 3
Castro Chapter 3Castro Chapter 3
Castro Chapter 3
 
Css
CssCss
Css
 
MTA html5 organization, input, and validation
MTA html5 organization, input, and validationMTA html5 organization, input, and validation
MTA html5 organization, input, and validation
 
Ifi7174 lesson2
Ifi7174 lesson2Ifi7174 lesson2
Ifi7174 lesson2
 
Cascading style sheets
Cascading style sheetsCascading style sheets
Cascading style sheets
 
Html n CSS
Html n CSSHtml n CSS
Html n CSS
 
Html and css
Html and cssHtml and css
Html and css
 
HTML & CSS: Chapter 04
HTML & CSS: Chapter 04HTML & CSS: Chapter 04
HTML & CSS: Chapter 04
 
Cascading style sheets
Cascading style sheetsCascading style sheets
Cascading style sheets
 
Intro to HTML5
Intro to HTML5Intro to HTML5
Intro to HTML5
 
Html presentation
Html presentationHtml presentation
Html presentation
 

Recently uploaded

SURVEY I created for uni project research
SURVEY I created for uni project researchSURVEY I created for uni project research
SURVEY I created for uni project research
CaitlinCummins3
 

Recently uploaded (20)

Including Mental Health Support in Project Delivery, 14 May.pdf
Including Mental Health Support in Project Delivery, 14 May.pdfIncluding Mental Health Support in Project Delivery, 14 May.pdf
Including Mental Health Support in Project Delivery, 14 May.pdf
 
Trauma-Informed Leadership - Five Practical Principles
Trauma-Informed Leadership - Five Practical PrinciplesTrauma-Informed Leadership - Five Practical Principles
Trauma-Informed Leadership - Five Practical Principles
 
OSCM Unit 2_Operations Processes & Systems
OSCM Unit 2_Operations Processes & SystemsOSCM Unit 2_Operations Processes & Systems
OSCM Unit 2_Operations Processes & Systems
 
OS-operating systems- ch05 (CPU Scheduling) ...
OS-operating systems- ch05 (CPU Scheduling) ...OS-operating systems- ch05 (CPU Scheduling) ...
OS-operating systems- ch05 (CPU Scheduling) ...
 
SURVEY I created for uni project research
SURVEY I created for uni project researchSURVEY I created for uni project research
SURVEY I created for uni project research
 
TỔNG HỢP HƠN 100 ĐỀ THI THỬ TỐT NGHIỆP THPT TOÁN 2024 - TỪ CÁC TRƯỜNG, TRƯỜNG...
TỔNG HỢP HƠN 100 ĐỀ THI THỬ TỐT NGHIỆP THPT TOÁN 2024 - TỪ CÁC TRƯỜNG, TRƯỜNG...TỔNG HỢP HƠN 100 ĐỀ THI THỬ TỐT NGHIỆP THPT TOÁN 2024 - TỪ CÁC TRƯỜNG, TRƯỜNG...
TỔNG HỢP HƠN 100 ĐỀ THI THỬ TỐT NGHIỆP THPT TOÁN 2024 - TỪ CÁC TRƯỜNG, TRƯỜNG...
 
Climbers and Creepers used in landscaping
Climbers and Creepers used in landscapingClimbers and Creepers used in landscaping
Climbers and Creepers used in landscaping
 
8 Tips for Effective Working Capital Management
8 Tips for Effective Working Capital Management8 Tips for Effective Working Capital Management
8 Tips for Effective Working Capital Management
 
Improved Approval Flow in Odoo 17 Studio App
Improved Approval Flow in Odoo 17 Studio AppImproved Approval Flow in Odoo 17 Studio App
Improved Approval Flow in Odoo 17 Studio App
 
DEMONSTRATION LESSON IN ENGLISH 4 MATATAG CURRICULUM
DEMONSTRATION LESSON IN ENGLISH 4 MATATAG CURRICULUMDEMONSTRATION LESSON IN ENGLISH 4 MATATAG CURRICULUM
DEMONSTRATION LESSON IN ENGLISH 4 MATATAG CURRICULUM
 
Mattingly "AI & Prompt Design: Named Entity Recognition"
Mattingly "AI & Prompt Design: Named Entity Recognition"Mattingly "AI & Prompt Design: Named Entity Recognition"
Mattingly "AI & Prompt Design: Named Entity Recognition"
 
Đề tieng anh thpt 2024 danh cho cac ban hoc sinh
Đề tieng anh thpt 2024 danh cho cac ban hoc sinhĐề tieng anh thpt 2024 danh cho cac ban hoc sinh
Đề tieng anh thpt 2024 danh cho cac ban hoc sinh
 
The Story of Village Palampur Class 9 Free Study Material PDF
The Story of Village Palampur Class 9 Free Study Material PDFThe Story of Village Palampur Class 9 Free Study Material PDF
The Story of Village Palampur Class 9 Free Study Material PDF
 
ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH FORM 50 CÂU TRẮC NGHI...
ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH FORM 50 CÂU TRẮC NGHI...ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH FORM 50 CÂU TRẮC NGHI...
ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH FORM 50 CÂU TRẮC NGHI...
 
Stl Algorithms in C++ jjjjjjjjjjjjjjjjjj
Stl Algorithms in C++ jjjjjjjjjjjjjjjjjjStl Algorithms in C++ jjjjjjjjjjjjjjjjjj
Stl Algorithms in C++ jjjjjjjjjjjjjjjjjj
 
How to Manage Website in Odoo 17 Studio App.pptx
How to Manage Website in Odoo 17 Studio App.pptxHow to Manage Website in Odoo 17 Studio App.pptx
How to Manage Website in Odoo 17 Studio App.pptx
 
24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...
24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...
24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...
 
Supporting Newcomer Multilingual Learners
Supporting Newcomer  Multilingual LearnersSupporting Newcomer  Multilingual Learners
Supporting Newcomer Multilingual Learners
 
Analyzing and resolving a communication crisis in Dhaka textiles LTD.pptx
Analyzing and resolving a communication crisis in Dhaka textiles LTD.pptxAnalyzing and resolving a communication crisis in Dhaka textiles LTD.pptx
Analyzing and resolving a communication crisis in Dhaka textiles LTD.pptx
 
Basic Civil Engineering notes on Transportation Engineering & Modes of Transport
Basic Civil Engineering notes on Transportation Engineering & Modes of TransportBasic Civil Engineering notes on Transportation Engineering & Modes of Transport
Basic Civil Engineering notes on Transportation Engineering & Modes of Transport
 

Block level HTML Tags.pptx Block level HTML Tags.pptx Block level HTML Tags.pptx Block level HTML Tags.pptx Block level HTML Tags.pptx

  • 1. Block level HTML Tags UNDERSTANDING STRUCTURE IN HTML
  • 2. Introduction to Block-Level Tags •Definition: Block-level elements create structural blocks in HTML. •Behavior: These elements start on a new line and occupy the full available width by default. •Examples: Show examples of block-level tags (e.g., <div>, <p>, <h1>-<h6>, <ul>, <ol>, <table>, etc.).
  • 3. Divisions with <div> •Definition: <div> is a versatile container used for grouping content. •Purpose: It helps organize and structure content for styling or layout purposes. •Example: Illustrate how <div> can enclose various elements within a block.
  • 4. Paragraphs with <p> •Definition: <p> represents a paragraph of text. •Usage: Ideal for separating and formatting blocks of te •Example: Show usage of <p> tags with text content.
  • 5. Headings with <h1> to <h6> •Definition: <h1> to <h6> represent different levels of headings. •Semantic Hierarchy: Explain the hierarchy and importance of these headings. •Example: Show different headings and their usage.
  • 6. Lists - <ul> and <ol> with <li> •Definition: <ul> creates unordered lists, <ol> creates ordered lists, <li> denotes list items. •Usage: Explain when to use each type of list. •Example: Show both types of lists with list ite
  • 7. Table Structure with <table>, <tr>, <th>, <td> •Definition: <table> creates a table structure; <tr> represents table rows; <th> denotes table header cells; <td> represents regular table cells. •Usage: Describe the structure of tables using these elements. •Example: Display a simple table structure with rows and cells.