SlideShare a Scribd company logo
1 of 35
Session No 1

Developed by: Saif Ullah Dar

12/17/2013

1
1)
2)

3)
4)
5)
6)
7)
8)
9)

Getting Started With HTML
Introducing HTML
How Web pages work
Introduction to Tags.
Structure of HTML page
Creating a Web Page
Introduction table, tr, td tags.
Paragraphs
Preformatted Paragraphs

Developed by: Saif Ullah Dar

12/17/2013

2
 The

World Wide Web (Web) is a network of
information resources. The Web relies on
three mechanisms to make these resources
readily available to the widest possible
audience:




A uniform naming scheme for locating resources
on the Web (e.g., URIs).
Protocols, for access to named resources over
the Web (e.g., HTTP).
Hypertext, for easy navigation among resources
(e.g., HTML).

Developed by: Saif Ullah Dar

12/17/2013

3
To publish information for global distribution, one
needs a universally understood language, a kind of
publishing mother tongue that all computers may
potentially understand. The publishing language used
by the World Wide Web is HTML (from Hypertext
Markup Language).

Developed by: Saif Ullah Dar

12/17/2013

4
A. HTML contains special markers, or tags, which
B.

define the style and structure of the page
Tags are also referred to as elements.

Developed by: Saif Ullah Dar

12/17/2013

5
 Publish

online documents with headings,
texts, tables, lists, photos, etc.
 Retrieve online information via hypertexts
links.
 Design forms for conducting transactions
with remote services, for use in searching for
information, making reservations, ordering
products, etc.
 Include spread-sheets, video clips, sound
clips, and other applications directly in their
documents.
Developed by: Saif Ullah Dar

12/17/2013

6
Click To
Proceed With
The Steps

Developed by: Saif Ullah Dar

12/17/2013

7
Double Click
on the
Internet
Explorer
button

Developed by: Saif Ullah Dar

12/17/2013

8
Browser
Window
Opens

Developed by: Saif Ullah Dar

12/17/2013

9
http://www.google.com

Type the url
address &
Press Enter
Key

Developed by: Saif Ullah Dar

12/17/2013

10
Internet

Web Server

Request
Request

http://www.google.com

User makes a request
www.google.com

HTML files

Developed by: Saif Ullah Dar

12/17/2013

11
Internet

Web Server

Web Page
Web Page

HTML files
Google page is returned from the Web Server

Developed by: Saif Ullah Dar

12/17/2013

12
Developed by: Saif Ullah Dar

12/17/2013

13
 A tag is a reference in an HTML document which
describes the style and structure of the document.

 All tag start with < (less than symbol) and end with

> (greater than symbol)

 Tags which mark a beginning have no / (front
slash).
 Tags which mark an ending have a / immediately
after <, as in </.

Developed by: Saif Ullah Dar

12/17/2013

14
 <HTML>,

<BODY>,
<TITLE>
 </HTML>,
</BODY>,
</TITLE>

Developed by: Saif Ullah Dar

 STARTING

TAGS /

ELEMENTS
 ENDING

TAGS /
ELEMENTS

12/17/2013

15
<HTML>
<HEAD>
<TITLE> My Home Page </TITLE>
</HEAD>
<!-- Written by Manas K Sahoo -->
<!-- Created: 30-May-2007 -->
<!-- Organization: IBM -->
<BODY>This is where the text goes.
</BODY>
</HTML>
Developed by: Saif Ullah Dar

12/17/2013

16
Start of an HTML document.

<HTML>
<HEAD>
<TITLE> My Home Page </TITLE>
</HEAD>
<!-- Written by Manas K Sahoo -->
<!-- Created: 30-May-2007 -->
<!-- Organization: IBM -->
<BODY>This is where the text goes.
</BODY>
</HTML>
Developed by: Saif Ullah Dar

12/17/2013

17
Indicates to the browser that this is an HTML
document.

<HTML>
<HEAD>
<TITLE> My Home Page </TITLE>
</HEAD>
<!-- Written by Manas K Sahoo -->
<!-- Created: 30-May-2007 -->
<!-- Organization: IBM -->
<BODY>This is where the text goes.
</BODY>
</HTML>
Developed by: Saif Ullah Dar

12/17/2013

18
HTML document is divided into two sections.
1. <HEAD> …. </HEAD>

<HTML>
<HEAD>
<TITLE> My Home Page </TITLE>
</HEAD>
<!-- Written by Manas K Sahoo -->
<!-- Created: 30-May-2007 -->
<!-- Organization: IBM -->
<BODY>This is where the text goes.
</BODY>
</HTML>
Developed by: Saif Ullah Dar

12/17/2013

19
HTML document is divided into two sections.
2. <BODY> …. </BODY>

<HTML>
<HEAD>
<TITLE> My Home Page </TITLE>
</HEAD>
<!-- Written by Manas K Sahoo -->
<!-- Created: 30-May-2007 -->
<!-- Organization: IBM -->
<BODY>This is where the text goes.
</BODY>
</HTML>
Developed by: Saif Ullah Dar

12/17/2013

20
Shows the contents in the browser title bar.
Generally placed inside Head tag.

<HTML>
<HEAD>
<TITLE> My Home Page </TITLE>
</HEAD>
<!-- Written by Manas K Sahoo -->
<!-- Created: 30-May-2007 -->
<!-- Organization: IBM -->
<BODY>This is where the text goes.
</BODY>
</HTML>
Developed by: Saif Ullah Dar

12/17/2013

21
Indicates comment tag. Can be placed anywhere
in the document.

<HTML>
<HEAD>
<TITLE> My Home Page </TITLE>
</HEAD>
<!-- Written by Manas K Sahoo -->
<!-- Created: 30-May-2007 -->
<!-- Organization: IBM -->
<BODY>This is where the text goes.
</BODY>
</HTML>
Developed by: Saif Ullah Dar

12/17/2013

22
Signal the end of HTML document.

<HTML>
<HEAD>
<TITLE> My Home Page </TITLE>
</HEAD>
<!-- Written by Manas K Sahoo -->
<!-- Created: 30-May-2007 -->
<!-- Organization: IBM -->
<BODY>This is where the text goes.
</BODY>
</HTML>
Developed by: Saif Ullah Dar

12/17/2013

23
Range / Container tags

They are called so because they cover a range of text.
Example : <HTML>, <HEAD>, <BODY>, <TITLE>

Standalone / Point tags
Those tags which do not need an ending.
Example: <HR>, <BR>

Developed by: Saif Ullah Dar

12/17/2013

24
Developed by: Saif Ullah Dar

12/17/2013

25


Tags used for separating one line with other can be
classifies as follows:1.

<P> tag

2.

<PRE> tag

3.

<BR> tag

4.

<HR> tag

Developed by: Saif Ullah Dar

12/17/2013

26
 Normally

all text in an HTML document is
treated like one long paragraph. Indented or
blank lines which normally indicate start of
paragraphs in text are ignored.
 To separate your text into paragraphs use the
 The <P> tag forces an end of line and forces
a blank line before the next paragraph.

Developed by: Saif Ullah Dar

12/17/2013

27

<P>
tag.
Developed by: Saif Ullah Dar

12/17/2013

28
Code Snippet To Fulfill the Requirement

<p>This is should be the end of my first
paragraph in HTML.</p>
<p>This should be the start of my second
paragraph in
HTML.</p>
<p>And this is should be my third paragraph in
HTML.</p>

Developed by: Saif Ullah Dar

12/17/2013

29
<p> tag forces an end of line and forces a blank line before the next paragraph.

<p>This is should be the end of my first
paragraph in HTML.</p>
<p>This should be the start of my second
paragraph in
HTML.</p>
<p>And this is should be my third paragraph in
HTML.</p>

Developed by: Saif Ullah Dar

12/17/2013

30
<p> tag forces an end of line and forces a blank line before the next paragraph.

<p>This is should be the end of my first
paragraph in HTML.</p>
<p>This should be the start of my second
paragraph in
HTML.</p>
<p>And this is should be my third paragraph in
HTML.</p>
Ends the paragraph tag.
Developed by: Saif Ullah Dar

12/17/2013

31
 Preformatted

tag is used to display the data
in the explorer as written in the Program.
 To use the tabs in the paragraphs
 This tag is used to place the data according
to your own style.
 The font size of this tag is different from the
font size of the <P> Tag
 Do not forget to close this Tag.

Developed by: Saif Ullah Dar

12/17/2013

32

<PRE>
tag.
Code Snippet To Fulfill the Requirement

<pre>This is should be the end of my first
Paragraph
in HTML Using the
PRE FORMATTED TAG.</pre>
<pre>This should be the start of my second
paragraph in
HTML.</pre>
<p>And this is should be my third paragraph in
HTML.</p>

Developed by: Saif Ullah Dar

12/17/2013

33
Developed by: Saif Ullah Dar

12/17/2013

34
SAIF ULLAH DAR

Developed by: Saif Ullah Dar

12/17/2013

35

More Related Content

What's hot (20)

Bangla html
Bangla htmlBangla html
Bangla html
 
Html
HtmlHtml
Html
 
Html
HtmlHtml
Html
 
Html css java script
Html css java script Html css java script
Html css java script
 
WEB DESIGNING MODULE
WEB DESIGNING MODULEWEB DESIGNING MODULE
WEB DESIGNING MODULE
 
Artdm171 Week3 Tags Group Projects
Artdm171 Week3 Tags Group ProjectsArtdm171 Week3 Tags Group Projects
Artdm171 Week3 Tags Group Projects
 
HTML & XHTML Basics
HTML & XHTML BasicsHTML & XHTML Basics
HTML & XHTML Basics
 
Basic HTML
Basic HTMLBasic HTML
Basic HTML
 
Html project report12
Html project report12Html project report12
Html project report12
 
Basic HTML
Basic HTMLBasic HTML
Basic HTML
 
Introduction to WEB HTML, CSS
Introduction to WEB HTML, CSSIntroduction to WEB HTML, CSS
Introduction to WEB HTML, CSS
 
Html basic
Html basicHtml basic
Html basic
 
Css by tanbircox
Css by tanbircoxCss by tanbircox
Css by tanbircox
 
Html basics
Html basicsHtml basics
Html basics
 
Webware - from Document to Operating System
Webware - from Document to Operating System Webware - from Document to Operating System
Webware - from Document to Operating System
 
Getting into HTML
Getting into HTMLGetting into HTML
Getting into HTML
 
Html tags describe in bangla
Html tags describe in banglaHtml tags describe in bangla
Html tags describe in bangla
 
Critical Rendering Path
Critical Rendering PathCritical Rendering Path
Critical Rendering Path
 
HTML
HTMLHTML
HTML
 
Learn CSS From Scratch
Learn CSS From ScratchLearn CSS From Scratch
Learn CSS From Scratch
 

Viewers also liked (8)

Session no 3
Session no 3Session no 3
Session no 3
 
Java script session 4
Java script session 4Java script session 4
Java script session 4
 
Session no 2
Session no 2Session no 2
Session no 2
 
Session no 4
Session no 4Session no 4
Session no 4
 
Session no 3 bzu
Session no 3 bzuSession no 3 bzu
Session no 3 bzu
 
HTML Fundamentals
HTML FundamentalsHTML Fundamentals
HTML Fundamentals
 
HTML: Tables and Forms
HTML: Tables and FormsHTML: Tables and Forms
HTML: Tables and Forms
 
HTML practicals
HTML practicals HTML practicals
HTML practicals
 

Similar to Session no 1 html

HTML (Basic to Advance)
HTML (Basic to Advance)HTML (Basic to Advance)
HTML (Basic to Advance)Coder Tech
 
HyperTextMarkupLanguage.ppt
HyperTextMarkupLanguage.pptHyperTextMarkupLanguage.ppt
HyperTextMarkupLanguage.pptDrShamikTiwari
 
Web design and Development
Web design and DevelopmentWeb design and Development
Web design and DevelopmentShagor Ahmed
 
Updated html programs
Updated html programsUpdated html programs
Updated html programsDeepali54
 
Comp 111chp iv vi
Comp 111chp iv viComp 111chp iv vi
Comp 111chp iv viBala Ganesh
 
INTRODUCTION FOR HTML
INTRODUCTION  FOR HTML INTRODUCTION  FOR HTML
INTRODUCTION FOR HTML Rahul Bathri
 
If you know nothing about HTML, this is where you can start !!
If you know nothing about HTML, this is where you can start !!If you know nothing about HTML, this is where you can start !!
If you know nothing about HTML, this is where you can start !!Dr Sukhpal Singh Gill
 
HSC INFORMATION TECHNOLOGY CHAPTER 1 ADVANCED WEB DESIGNING PART I.pdf
HSC INFORMATION TECHNOLOGY CHAPTER 1 ADVANCED WEB DESIGNING PART I.pdfHSC INFORMATION TECHNOLOGY CHAPTER 1 ADVANCED WEB DESIGNING PART I.pdf
HSC INFORMATION TECHNOLOGY CHAPTER 1 ADVANCED WEB DESIGNING PART I.pdfAAFREEN SHAIKH
 
Intr to-html-xhtml-1233508169541646-3
Intr to-html-xhtml-1233508169541646-3Intr to-html-xhtml-1233508169541646-3
Intr to-html-xhtml-1233508169541646-3bluejayjunior
 
HTML Notes for new begginers for HTML CSS
HTML Notes for new begginers for HTML CSSHTML Notes for new begginers for HTML CSS
HTML Notes for new begginers for HTML CSSRajChauhan226834
 
Web Design Basics: HTML Essentials for begginer
Web Design Basics: HTML Essentials for begginerWeb Design Basics: HTML Essentials for begginer
Web Design Basics: HTML Essentials for begginerRajChauhan226834
 
Hypertext_markup_language
Hypertext_markup_languageHypertext_markup_language
Hypertext_markup_languageIshaq Shinwari
 
SDP_HTML.pptx
SDP_HTML.pptxSDP_HTML.pptx
SDP_HTML.pptxVani011
 
HTML and ASP.NET
HTML and ASP.NETHTML and ASP.NET
HTML and ASP.NETPadma Metta
 

Similar to Session no 1 html (20)

HTML (Basic to Advance)
HTML (Basic to Advance)HTML (Basic to Advance)
HTML (Basic to Advance)
 
Advance HTML
Advance HTMLAdvance HTML
Advance HTML
 
HyperTextMarkupLanguage.ppt
HyperTextMarkupLanguage.pptHyperTextMarkupLanguage.ppt
HyperTextMarkupLanguage.ppt
 
Web design and Development
Web design and DevelopmentWeb design and Development
Web design and Development
 
Updated html programs
Updated html programsUpdated html programs
Updated html programs
 
Html 5
Html 5Html 5
Html 5
 
Comp 111chp iv vi
Comp 111chp iv viComp 111chp iv vi
Comp 111chp iv vi
 
INTRODUCTION FOR HTML
INTRODUCTION  FOR HTML INTRODUCTION  FOR HTML
INTRODUCTION FOR HTML
 
If you know nothing about HTML, this is where you can start !!
If you know nothing about HTML, this is where you can start !!If you know nothing about HTML, this is where you can start !!
If you know nothing about HTML, this is where you can start !!
 
HSC INFORMATION TECHNOLOGY CHAPTER 1 ADVANCED WEB DESIGNING PART I.pdf
HSC INFORMATION TECHNOLOGY CHAPTER 1 ADVANCED WEB DESIGNING PART I.pdfHSC INFORMATION TECHNOLOGY CHAPTER 1 ADVANCED WEB DESIGNING PART I.pdf
HSC INFORMATION TECHNOLOGY CHAPTER 1 ADVANCED WEB DESIGNING PART I.pdf
 
Intr to-html-xhtml-1233508169541646-3
Intr to-html-xhtml-1233508169541646-3Intr to-html-xhtml-1233508169541646-3
Intr to-html-xhtml-1233508169541646-3
 
Learn HTML Easier
Learn HTML EasierLearn HTML Easier
Learn HTML Easier
 
HTML Notes for new begginers for HTML CSS
HTML Notes for new begginers for HTML CSSHTML Notes for new begginers for HTML CSS
HTML Notes for new begginers for HTML CSS
 
Web Design Basics: HTML Essentials for begginer
Web Design Basics: HTML Essentials for begginerWeb Design Basics: HTML Essentials for begginer
Web Design Basics: HTML Essentials for begginer
 
Htmlppt
Htmlppt Htmlppt
Htmlppt
 
Hypertext_markup_language
Hypertext_markup_languageHypertext_markup_language
Hypertext_markup_language
 
SDP_HTML.pptx
SDP_HTML.pptxSDP_HTML.pptx
SDP_HTML.pptx
 
Html1
Html1Html1
Html1
 
Html
HtmlHtml
Html
 
HTML and ASP.NET
HTML and ASP.NETHTML and ASP.NET
HTML and ASP.NET
 

Recently uploaded

Keynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-designKeynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-designMIPLM
 
Integumentary System SMP B. Pharm Sem I.ppt
Integumentary System SMP B. Pharm Sem I.pptIntegumentary System SMP B. Pharm Sem I.ppt
Integumentary System SMP B. Pharm Sem I.pptshraddhaparab530
 
Inclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdf
Inclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdfInclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdf
Inclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdfTechSoup
 
Influencing policy (training slides from Fast Track Impact)
Influencing policy (training slides from Fast Track Impact)Influencing policy (training slides from Fast Track Impact)
Influencing policy (training slides from Fast Track Impact)Mark Reed
 
USPS® Forced Meter Migration - How to Know if Your Postage Meter Will Soon be...
USPS® Forced Meter Migration - How to Know if Your Postage Meter Will Soon be...USPS® Forced Meter Migration - How to Know if Your Postage Meter Will Soon be...
USPS® Forced Meter Migration - How to Know if Your Postage Meter Will Soon be...Postal Advocate Inc.
 
Presentation Activity 2. Unit 3 transv.pptx
Presentation Activity 2. Unit 3 transv.pptxPresentation Activity 2. Unit 3 transv.pptx
Presentation Activity 2. Unit 3 transv.pptxRosabel UA
 
Virtual-Orientation-on-the-Administration-of-NATG12-NATG6-and-ELLNA.pdf
Virtual-Orientation-on-the-Administration-of-NATG12-NATG6-and-ELLNA.pdfVirtual-Orientation-on-the-Administration-of-NATG12-NATG6-and-ELLNA.pdf
Virtual-Orientation-on-the-Administration-of-NATG12-NATG6-and-ELLNA.pdfErwinPantujan2
 
ROLES IN A STAGE PRODUCTION in arts.pptx
ROLES IN A STAGE PRODUCTION in arts.pptxROLES IN A STAGE PRODUCTION in arts.pptx
ROLES IN A STAGE PRODUCTION in arts.pptxVanesaIglesias10
 
Concurrency Control in Database Management system
Concurrency Control in Database Management systemConcurrency Control in Database Management system
Concurrency Control in Database Management systemChristalin Nelson
 
Q4-PPT-Music9_Lesson-1-Romantic-Opera.pptx
Q4-PPT-Music9_Lesson-1-Romantic-Opera.pptxQ4-PPT-Music9_Lesson-1-Romantic-Opera.pptx
Q4-PPT-Music9_Lesson-1-Romantic-Opera.pptxlancelewisportillo
 
INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptx
INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptxINTRODUCTION TO CATHOLIC CHRISTOLOGY.pptx
INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptxHumphrey A Beña
 
Grade 9 Quarter 4 Dll Grade 9 Quarter 4 DLL.pdf
Grade 9 Quarter 4 Dll Grade 9 Quarter 4 DLL.pdfGrade 9 Quarter 4 Dll Grade 9 Quarter 4 DLL.pdf
Grade 9 Quarter 4 Dll Grade 9 Quarter 4 DLL.pdfJemuel Francisco
 
ANG SEKTOR NG agrikultura.pptx QUARTER 4
ANG SEKTOR NG agrikultura.pptx QUARTER 4ANG SEKTOR NG agrikultura.pptx QUARTER 4
ANG SEKTOR NG agrikultura.pptx QUARTER 4MiaBumagat1
 
ICS2208 Lecture6 Notes for SL spaces.pdf
ICS2208 Lecture6 Notes for SL spaces.pdfICS2208 Lecture6 Notes for SL spaces.pdf
ICS2208 Lecture6 Notes for SL spaces.pdfVanessa Camilleri
 
HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...
HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...
HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...Nguyen Thanh Tu Collection
 
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17Celine George
 
Measures of Position DECILES for ungrouped data
Measures of Position DECILES for ungrouped dataMeasures of Position DECILES for ungrouped data
Measures of Position DECILES for ungrouped dataBabyAnnMotar
 

Recently uploaded (20)

Keynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-designKeynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-design
 
INCLUSIVE EDUCATION PRACTICES FOR TEACHERS AND TRAINERS.pptx
INCLUSIVE EDUCATION PRACTICES FOR TEACHERS AND TRAINERS.pptxINCLUSIVE EDUCATION PRACTICES FOR TEACHERS AND TRAINERS.pptx
INCLUSIVE EDUCATION PRACTICES FOR TEACHERS AND TRAINERS.pptx
 
Integumentary System SMP B. Pharm Sem I.ppt
Integumentary System SMP B. Pharm Sem I.pptIntegumentary System SMP B. Pharm Sem I.ppt
Integumentary System SMP B. Pharm Sem I.ppt
 
Inclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdf
Inclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdfInclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdf
Inclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdf
 
Influencing policy (training slides from Fast Track Impact)
Influencing policy (training slides from Fast Track Impact)Influencing policy (training slides from Fast Track Impact)
Influencing policy (training slides from Fast Track Impact)
 
USPS® Forced Meter Migration - How to Know if Your Postage Meter Will Soon be...
USPS® Forced Meter Migration - How to Know if Your Postage Meter Will Soon be...USPS® Forced Meter Migration - How to Know if Your Postage Meter Will Soon be...
USPS® Forced Meter Migration - How to Know if Your Postage Meter Will Soon be...
 
Presentation Activity 2. Unit 3 transv.pptx
Presentation Activity 2. Unit 3 transv.pptxPresentation Activity 2. Unit 3 transv.pptx
Presentation Activity 2. Unit 3 transv.pptx
 
Virtual-Orientation-on-the-Administration-of-NATG12-NATG6-and-ELLNA.pdf
Virtual-Orientation-on-the-Administration-of-NATG12-NATG6-and-ELLNA.pdfVirtual-Orientation-on-the-Administration-of-NATG12-NATG6-and-ELLNA.pdf
Virtual-Orientation-on-the-Administration-of-NATG12-NATG6-and-ELLNA.pdf
 
YOUVE GOT EMAIL_FINALS_EL_DORADO_2024.pptx
YOUVE GOT EMAIL_FINALS_EL_DORADO_2024.pptxYOUVE GOT EMAIL_FINALS_EL_DORADO_2024.pptx
YOUVE GOT EMAIL_FINALS_EL_DORADO_2024.pptx
 
ROLES IN A STAGE PRODUCTION in arts.pptx
ROLES IN A STAGE PRODUCTION in arts.pptxROLES IN A STAGE PRODUCTION in arts.pptx
ROLES IN A STAGE PRODUCTION in arts.pptx
 
Concurrency Control in Database Management system
Concurrency Control in Database Management systemConcurrency Control in Database Management system
Concurrency Control in Database Management system
 
Q4-PPT-Music9_Lesson-1-Romantic-Opera.pptx
Q4-PPT-Music9_Lesson-1-Romantic-Opera.pptxQ4-PPT-Music9_Lesson-1-Romantic-Opera.pptx
Q4-PPT-Music9_Lesson-1-Romantic-Opera.pptx
 
INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptx
INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptxINTRODUCTION TO CATHOLIC CHRISTOLOGY.pptx
INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptx
 
Grade 9 Quarter 4 Dll Grade 9 Quarter 4 DLL.pdf
Grade 9 Quarter 4 Dll Grade 9 Quarter 4 DLL.pdfGrade 9 Quarter 4 Dll Grade 9 Quarter 4 DLL.pdf
Grade 9 Quarter 4 Dll Grade 9 Quarter 4 DLL.pdf
 
ANG SEKTOR NG agrikultura.pptx QUARTER 4
ANG SEKTOR NG agrikultura.pptx QUARTER 4ANG SEKTOR NG agrikultura.pptx QUARTER 4
ANG SEKTOR NG agrikultura.pptx QUARTER 4
 
ICS2208 Lecture6 Notes for SL spaces.pdf
ICS2208 Lecture6 Notes for SL spaces.pdfICS2208 Lecture6 Notes for SL spaces.pdf
ICS2208 Lecture6 Notes for SL spaces.pdf
 
FINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptx
FINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptxFINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptx
FINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptx
 
HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...
HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...
HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...
 
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17
 
Measures of Position DECILES for ungrouped data
Measures of Position DECILES for ungrouped dataMeasures of Position DECILES for ungrouped data
Measures of Position DECILES for ungrouped data
 

Session no 1 html

  • 1. Session No 1 Developed by: Saif Ullah Dar 12/17/2013 1
  • 2. 1) 2) 3) 4) 5) 6) 7) 8) 9) Getting Started With HTML Introducing HTML How Web pages work Introduction to Tags. Structure of HTML page Creating a Web Page Introduction table, tr, td tags. Paragraphs Preformatted Paragraphs Developed by: Saif Ullah Dar 12/17/2013 2
  • 3.  The World Wide Web (Web) is a network of information resources. The Web relies on three mechanisms to make these resources readily available to the widest possible audience:    A uniform naming scheme for locating resources on the Web (e.g., URIs). Protocols, for access to named resources over the Web (e.g., HTTP). Hypertext, for easy navigation among resources (e.g., HTML). Developed by: Saif Ullah Dar 12/17/2013 3
  • 4. To publish information for global distribution, one needs a universally understood language, a kind of publishing mother tongue that all computers may potentially understand. The publishing language used by the World Wide Web is HTML (from Hypertext Markup Language). Developed by: Saif Ullah Dar 12/17/2013 4
  • 5. A. HTML contains special markers, or tags, which B. define the style and structure of the page Tags are also referred to as elements. Developed by: Saif Ullah Dar 12/17/2013 5
  • 6.  Publish online documents with headings, texts, tables, lists, photos, etc.  Retrieve online information via hypertexts links.  Design forms for conducting transactions with remote services, for use in searching for information, making reservations, ordering products, etc.  Include spread-sheets, video clips, sound clips, and other applications directly in their documents. Developed by: Saif Ullah Dar 12/17/2013 6
  • 7. Click To Proceed With The Steps Developed by: Saif Ullah Dar 12/17/2013 7
  • 10. http://www.google.com Type the url address & Press Enter Key Developed by: Saif Ullah Dar 12/17/2013 10
  • 11. Internet Web Server Request Request http://www.google.com User makes a request www.google.com HTML files Developed by: Saif Ullah Dar 12/17/2013 11
  • 12. Internet Web Server Web Page Web Page HTML files Google page is returned from the Web Server Developed by: Saif Ullah Dar 12/17/2013 12
  • 13. Developed by: Saif Ullah Dar 12/17/2013 13
  • 14.  A tag is a reference in an HTML document which describes the style and structure of the document.  All tag start with < (less than symbol) and end with > (greater than symbol)  Tags which mark a beginning have no / (front slash).  Tags which mark an ending have a / immediately after <, as in </. Developed by: Saif Ullah Dar 12/17/2013 14
  • 15.  <HTML>, <BODY>, <TITLE>  </HTML>, </BODY>, </TITLE> Developed by: Saif Ullah Dar  STARTING TAGS / ELEMENTS  ENDING TAGS / ELEMENTS 12/17/2013 15
  • 16. <HTML> <HEAD> <TITLE> My Home Page </TITLE> </HEAD> <!-- Written by Manas K Sahoo --> <!-- Created: 30-May-2007 --> <!-- Organization: IBM --> <BODY>This is where the text goes. </BODY> </HTML> Developed by: Saif Ullah Dar 12/17/2013 16
  • 17. Start of an HTML document. <HTML> <HEAD> <TITLE> My Home Page </TITLE> </HEAD> <!-- Written by Manas K Sahoo --> <!-- Created: 30-May-2007 --> <!-- Organization: IBM --> <BODY>This is where the text goes. </BODY> </HTML> Developed by: Saif Ullah Dar 12/17/2013 17
  • 18. Indicates to the browser that this is an HTML document. <HTML> <HEAD> <TITLE> My Home Page </TITLE> </HEAD> <!-- Written by Manas K Sahoo --> <!-- Created: 30-May-2007 --> <!-- Organization: IBM --> <BODY>This is where the text goes. </BODY> </HTML> Developed by: Saif Ullah Dar 12/17/2013 18
  • 19. HTML document is divided into two sections. 1. <HEAD> …. </HEAD> <HTML> <HEAD> <TITLE> My Home Page </TITLE> </HEAD> <!-- Written by Manas K Sahoo --> <!-- Created: 30-May-2007 --> <!-- Organization: IBM --> <BODY>This is where the text goes. </BODY> </HTML> Developed by: Saif Ullah Dar 12/17/2013 19
  • 20. HTML document is divided into two sections. 2. <BODY> …. </BODY> <HTML> <HEAD> <TITLE> My Home Page </TITLE> </HEAD> <!-- Written by Manas K Sahoo --> <!-- Created: 30-May-2007 --> <!-- Organization: IBM --> <BODY>This is where the text goes. </BODY> </HTML> Developed by: Saif Ullah Dar 12/17/2013 20
  • 21. Shows the contents in the browser title bar. Generally placed inside Head tag. <HTML> <HEAD> <TITLE> My Home Page </TITLE> </HEAD> <!-- Written by Manas K Sahoo --> <!-- Created: 30-May-2007 --> <!-- Organization: IBM --> <BODY>This is where the text goes. </BODY> </HTML> Developed by: Saif Ullah Dar 12/17/2013 21
  • 22. Indicates comment tag. Can be placed anywhere in the document. <HTML> <HEAD> <TITLE> My Home Page </TITLE> </HEAD> <!-- Written by Manas K Sahoo --> <!-- Created: 30-May-2007 --> <!-- Organization: IBM --> <BODY>This is where the text goes. </BODY> </HTML> Developed by: Saif Ullah Dar 12/17/2013 22
  • 23. Signal the end of HTML document. <HTML> <HEAD> <TITLE> My Home Page </TITLE> </HEAD> <!-- Written by Manas K Sahoo --> <!-- Created: 30-May-2007 --> <!-- Organization: IBM --> <BODY>This is where the text goes. </BODY> </HTML> Developed by: Saif Ullah Dar 12/17/2013 23
  • 24. Range / Container tags They are called so because they cover a range of text. Example : <HTML>, <HEAD>, <BODY>, <TITLE> Standalone / Point tags Those tags which do not need an ending. Example: <HR>, <BR> Developed by: Saif Ullah Dar 12/17/2013 24
  • 25. Developed by: Saif Ullah Dar 12/17/2013 25
  • 26.  Tags used for separating one line with other can be classifies as follows:1. <P> tag 2. <PRE> tag 3. <BR> tag 4. <HR> tag Developed by: Saif Ullah Dar 12/17/2013 26
  • 27.  Normally all text in an HTML document is treated like one long paragraph. Indented or blank lines which normally indicate start of paragraphs in text are ignored.  To separate your text into paragraphs use the  The <P> tag forces an end of line and forces a blank line before the next paragraph. Developed by: Saif Ullah Dar 12/17/2013 27 <P> tag.
  • 28. Developed by: Saif Ullah Dar 12/17/2013 28
  • 29. Code Snippet To Fulfill the Requirement <p>This is should be the end of my first paragraph in HTML.</p> <p>This should be the start of my second paragraph in HTML.</p> <p>And this is should be my third paragraph in HTML.</p> Developed by: Saif Ullah Dar 12/17/2013 29
  • 30. <p> tag forces an end of line and forces a blank line before the next paragraph. <p>This is should be the end of my first paragraph in HTML.</p> <p>This should be the start of my second paragraph in HTML.</p> <p>And this is should be my third paragraph in HTML.</p> Developed by: Saif Ullah Dar 12/17/2013 30
  • 31. <p> tag forces an end of line and forces a blank line before the next paragraph. <p>This is should be the end of my first paragraph in HTML.</p> <p>This should be the start of my second paragraph in HTML.</p> <p>And this is should be my third paragraph in HTML.</p> Ends the paragraph tag. Developed by: Saif Ullah Dar 12/17/2013 31
  • 32.  Preformatted tag is used to display the data in the explorer as written in the Program.  To use the tabs in the paragraphs  This tag is used to place the data according to your own style.  The font size of this tag is different from the font size of the <P> Tag  Do not forget to close this Tag. Developed by: Saif Ullah Dar 12/17/2013 32 <PRE> tag.
  • 33. Code Snippet To Fulfill the Requirement <pre>This is should be the end of my first Paragraph in HTML Using the PRE FORMATTED TAG.</pre> <pre>This should be the start of my second paragraph in HTML.</pre> <p>And this is should be my third paragraph in HTML.</p> Developed by: Saif Ullah Dar 12/17/2013 33
  • 34. Developed by: Saif Ullah Dar 12/17/2013 34
  • 35. SAIF ULLAH DAR Developed by: Saif Ullah Dar 12/17/2013 35