session no 1 html
TRANSCRIPT
HTML 5.0Session No 1
04/11/2023Developed by: Saif Ullah Dar 1
OBJECTIVES1) Getting Started With HTML2) Introducing HTML3) How Web pages work4) Introduction to Tags.5) Structure of HTML page6) Creating a Web Page7) Introduction table, tr, td tags.8) Paragraphs9) Preformatted Paragraphs
04/11/2023Developed by: Saif Ullah Dar 2
WHAT IS WORLD WIDE WEB? 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).
04/11/2023Developed by: Saif Ullah Dar 3
INTRODUCING HTML
4Developed by: Saif Ullah Dar 04/11/2023
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).
WHAT IS HTML?
5Developed by: Saif Ullah Dar 04/11/2023
A. HTML contains special markers, or tags, which define the style and structure of the page
B. Tags are also referred to as elements.
USE OF HTML 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.
04/11/2023Developed by: Saif Ullah Dar 6
HOW TO ACCESS AN WEB PAGE
Click To Proceed With The Steps
04/11/2023Developed by: Saif Ullah Dar 7
8Developed by: Saif Ullah Dar 04/11/2023
Double Click on the
Internet Explorerbutton
9Developed by: Saif Ullah Dar 04/11/2023
Browser Window Opens
10Developed by: Saif Ullah Dar 04/11/2023
Type the url address &
Press Enter Key
http://www.google.com
04/11/2023Developed by: Saif Ullah Dar 11
HTML files
Web ServerInternet
RequestRequest
User makes a request
www.google.com
http://www.google.com
04/11/2023Developed by: Saif Ullah Dar 12
HTML files
Web ServerInternet
Web PageWeb Page
Google page is returned from the Web Server
13Developed by: Saif Ullah Dar 04/11/2023
WHAT IS TAG?
14Developed by: Saif Ullah Dar 04/11/2023
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 </.
EXAMPLE OF TAG <HTML>,
<BODY>, <TITLE>
</HTML>, </BODY>, </TITLE>
STARTING TAGS / ELEMENTS
ENDING TAGS / ELEMENTS
04/11/2023Developed by: Saif Ullah Dar 15
EXPLANATION OF THE HTML CODE
16Developed by: Saif Ullah Dar 04/11/2023
<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>
EXPLANATION OF THE HTML CODE
17Developed by: Saif Ullah Dar 04/11/2023
<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>
Start of an HTML document.
EXPLANATION OF THE HTML CODE
18Developed by: Saif Ullah Dar 04/11/2023
<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>
Indicates to the browser that this is an HTML document.
EXPLANATION OF THE HTML CODE
19Developed by: Saif Ullah Dar 04/11/2023
<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>
HTML document is divided into two sections. 1. <HEAD> …. </HEAD>
EXPLANATION OF THE HTML CODE
20Developed by: Saif Ullah Dar 04/11/2023
<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>
HTML document is divided into two sections. 2. <BODY> …. </BODY>
EXPLANATION OF THE HTML CODE
21Developed by: Saif Ullah Dar 04/11/2023
<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>
Shows the contents in the browser title bar. Generally placed inside Head tag.
EXPLANATION OF THE HTML CODE
22Developed by: Saif Ullah Dar 04/11/2023
<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>
Indicates comment tag. Can be placed anywhere in the document.
EXPLANATION OF THE HTML CODE
23Developed by: Saif Ullah Dar 04/11/2023
<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>
Signal the end of HTML document.
KINDS OF TAGS
24Developed by: Saif Ullah Dar 04/11/2023
Range / Container tags
Standalone / Point tags
They are called so because they cover a range of text.
Example : <HTML>, <HEAD>, <BODY>, <TITLE>
Those tags which do not need an ending.
Example: <HR>, <BR>
PARAGRAPHS
04/11/2023Developed by: Saif Ullah Dar 25
LINE SEPARATORS Tags used for separating one line with other
can be classifies as follows:-
04/11/2023Developed by: Saif Ullah Dar 26
1. <P> tag
3. <BR> tag
4. <HR> tag
2. <PRE> tag
THE <P> TAG 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.
04/11/2023Developed by: Saif Ullah Dar 27
<P>
tag.
PARAGRAPH TAG VIEW
04/11/2023Developed by: Saif Ullah Dar 28
<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>
04/11/2023Developed by: Saif Ullah Dar 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>
04/11/2023Developed by: Saif Ullah Dar 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>
04/11/2023Developed by: Saif Ullah Dar 31
<p> tag forces an end of line and forces a blank line before the next paragraph.
Ends the paragraph tag.
THE <PRE> TAG 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.
04/11/2023Developed by: Saif Ullah Dar 32
<PRE>
tag.
<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>
04/11/2023Developed by: Saif Ullah Dar 33
Code Snippet To Fulfill the Requirement
04/11/2023Developed by: Saif Ullah Dar 34
THANK YOU VERY
MUCH
SAIF ULLAH DAR
04/11/2023Developed by: Saif Ullah Dar 35